5

私はAngular jsが初めてです

コードでコントローラーが正しく動作しない

私は次のコードを実行しようとしています

<!DOCTYPE html>
<html data-ng-app >
<head>
    <title>Using AngularJS Directives and Data binding</title>
</head>
<body>

    name 
    <br />

    <div data-ng-controller="SimpleController">
    <input type="text"  data-ng-model="name"/>{{name}}

    <ul>
    <li data-ng-repeat="cust in customers | filter:name | orderBy:city"> {{cust.name | uppercase}}-{{cust.city | lowercase}} </li>
    </ul>
    </div>

    <script src= "angular/angular.min.js"></script>

    <script>

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

        demoApp.controller('SimpleController', function($scope){
        $scope.customers=[
        {name:'John Smith', city:'kashipur'},
        {name:'John fds' , city:'san francisko'},
        { name:'shubham', city:'giarhineg'},
        {name:'batra', city:'world'}];
        });
    </script>
</body>
</html>
</html>

しかし、それは欲望の出力を与えていません。

私が何か間違っているかどうか教えてください。

4

2 に答える 2

4

ページでモジュールng-appを実行するようにAngularに指示するディレクティブに値を追加できません。demoApp

ng-app="demoApp"
于 2015-06-06T21:14:39.430 に答える
1

アプリの名前を追加する必要があります。

ng-app="demoApp"


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

  demoApp.controller('SimpleController', function($scope) {
    $scope.customers = [{
      name: 'John Smith',
      city: 'kashipur'
    }, {
      name: 'John fds',
      city: 'san francisko'
    }, {
      name: 'shubham',
      city: 'giarhineg'
    }, {
      name: 'batra',
      city: 'world'
    }];
  });
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>
<div ng-app="demoApp">
  name
  <br />

  <div data-ng-controller="SimpleController">
    <input type="text" data-ng-model="name" />{{name}}

    <ul>
      <li data-ng-repeat="cust in customers | filter:name | orderBy:city">{{cust.name | uppercase}}-{{cust.city | lowercase}}</li>
    </ul>
  </div>
</div>

于 2015-06-06T21:15:52.300 に答える