【问题标题】:angular ng-app="demoApp" does not work for meangular ng-app="demoApp" 对我不起作用
【发布时间】:2016-03-02 07:10:08
【问题描述】:

我是 Angular 的新手。到目前为止,该代码运行良好,但当我使用 ng-app="demoApp" 或任何其他应用程序指令时,它似乎停止工作。它不能绑定在控制器上。这是我的看法:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
    <title>Learn AngularJS->Binding on the Controllers</title>  

</head>

<body>

<div class="container" ng-app="demoApp" data-ng-controller="simpleController">
<h3>Adding a simple Controller</h3>

<ul>

<li data-ng-repeat="cust in customers"> 
{{cust.name}} - {{cust.city}}

</li>

</ul>

</div>

这是我的 js/controller/simpleController.js

 var app = angular.module('demoApp',[]);
   var app = angular.module('demoApp',[]);
app.controller('simpleController',function($scope)
{
$scope.customers=[
{name:'John Smith',{city:'Kitale'},
{name:'Jane Martins',{city:'Bungoma'},
{name:'Esther Williams',{city:'Busia'},
{name:'James Anthony',{city:'Nakuru'},
{name:'Irine seniorman',{city:'Eldoret'},
{name:'Agrey Ngoya',{city:'Kitui'},
{name:'Anne Chemos',{city:'Bomet'},
{name:'Zacheous Waweru',{city:'Murang\'a'}

];

});
<script type="text/javascript" src="../js/angular-1.5.0/angular.min.js"></script>

<script type="text/javascript" src="../js/controller/simpleController.js"></script>

这是在我上面的视图中包含 ng-app=demoApp" 指令后进入浏览器的内容:

Adding a simple Controller

{{cust.name}} - {{cust.city}}

但是当我删除 ng-app="demoApp" 时,其他代码工作得很好。我不明白的是 ng-app 指令对我不起作用。其他指令工作正常,但也停止工作 app 指令在代码中的任何位置使用。我已经检查以确保 app 指令没有在代码中使用两次,但根本没有成功。请任何帮助,我可能会出错。我找不到任何错误。

【问题讨论】:

  • &lt;script src='js/controller/simpleController.js'&gt;&lt;/script&gt;一样在html中加载你的JS文件
  • 请看下面的答案。也许这会对您有所帮助,您对 $scope.customers 的定义是错误的。您可以检查 plunker 并查看您可以使用您拥有的代码做什么。点赞并勾选正确,让帮助者想要提供更多帮助:)

标签: angularjs


【解决方案1】:

您的客户数组中有一些错误复制粘贴下面的代码,然后重试。

HTML

<body ng-app="demoApp">
    <div class="container" ng-controller="simpleController">
      <h3>Adding a simple Controller</h3>

      <ul>

      <li data-ng-repeat="cust in customers"> 
      {{cust.name}} - {{cust.city}}

      </li>

      </ul>

    </div>
  </body>

Controller.js

var app = angular.module('demoApp',[]);

app.controller('simpleController',['$scope', function($scope){
  $scope.customers=[
    {name:'John Smith',city:'Kitale'},
    {name:'Jane Martins',city:'Bungoma'},
    {name:'Esther Williams',city:'Busia'},
    {name:'James Anthony',city:'Nakuru'},
    {name:'Irine seniorman',city:'Eldoret'},
    {name:'Agrey Ngoya',city:'Kitui'},
    {name:'Anne Chemos',city:'Bomet'},
    {name:'Zacheous Waweru',city:'Murang\'a'}
  ];
}]);

【讨论】:

  • 非常感谢,现在可以使用了。这只是你指出的问题。
【解决方案2】:

你的数组定义有误。

否: {name:'John Smith',{city:'Kitale'}
是: {name:'John Smith',city:'Kitale'}

这是工作中的 Plunker: http://plnkr.co/edit/hC3iY8HUG23N7DjIS2hP?p=preview

所以,你的整体代码:

<!DOCTYPE html>
<html>

<head>
    <script data-require="angular.js@*" data-semver="1.3.0-beta.5" src="https://code.angularjs.org/1.3.0-beta.5/angular.js"></script>
    <link rel="stylesheet" href="style.css" />
    <script src="script.js"></script>
</head>

<body>
    <div class="container" ng-app="demoApp" data-ng-controller="simpleController">
        <h3>Adding a simple Controller</h3>
        <ul>
            <li data-ng-repeat="cust in customers">
                {{cust.name}} - {{cust.city}}
            </li>
        </ul>

    </div>
    <script>
        var app = angular.module('demoApp', []);
        app.controller('simpleController', function($scope) {
            $scope.customers = [{
                    name: 'John Smith',
                    city: 'Kitale'
                }, {
                    name: 'Jane Martins',
                    city: 'Bungoma'
                }, {
                    name: 'Esther Williams',
                    city: 'Busia'
                }, {
                    name: 'James Anthony',
                    city: 'Nakuru'
                }, {
                    name: 'Irine seniorman',
                    city: 'Eldoret'
                }, {
                    name: 'Agrey Ngoya',
                    city: 'Kitui'
                }, {
                    name: 'Anne Chemos',
                    city: 'Bomet'
                }, {
                    name: 'Zacheous Waweru',
                    city: 'Murang\'a'
                }

            ];

        });
    </script>
</body>

</html>

【讨论】:

  • 感谢@Alex Rumba Nicked。有用。非常感谢您的帮助。
  • 很高兴能为您提供帮助。
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 2018-07-10
  • 1970-01-01
  • 1970-01-01
  • 1970-01-01
  • 2015-12-31
  • 2018-04-30
  • 1970-01-01
相关资源
最近更新 更多