如何在Angular JS中配置視圖和控制器模塊

Question

如何在angulaaJS中鏈接模塊控制器和視圖。 我正在嘗試與以下代碼鏈接我遇到錯誤，請幫助我查找代碼中的錯誤。

控制器代碼：

<!DOCTYPE html>
<html >
<head><title>Angular JS Example</title>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.8/angular.min.js"></script>
</head>
<body>
<div ng-view=""  ng-app="myApp">
</div>
<script>

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

app.config(function ($routeProvider){
$routeProvider
  .when('/view1.html',
      {
          controller:'myCtrl',
          templateUrl:'Partials/view1.html'
      })
   .when('/view2',
      {
          controller:'myCtrl',
          templateUrl:'Partials/view2.html'
      })
    .otherwise({redirectTo:'/view1'});
});

app.controller('myCtrl',function($scope){
    $scope.customers=[
               {name:'JohnSmith',city:'Phonenix'}
               {name:'devsenny',city:'New York'}
               {name:'benny',city:'san Francisco'}];
});

$scope.addCust=function(){
$scope.customers.push(
{
name:$scope.newcustomer.name,
city:$scope.newcustomer.city});
};
});
</script>
</body>
</html>

查看代碼1：

<div class="container">
    <h2>View 1</h2>

Name:
<br/>
<input type="text" ng-model="filter.name"/>
<br/>
<ul>
  <li ng-repeat="cust in customers">{{cust}}</li>

</ul>
<br/>
Customer Name:<br/>
<input type="text" ng-model="newcustomer.name">
<br/>
Customer city:<br/>
<input type="text" ng-model="newcustomer.city">
<br/>
<buttton ng-click="addCust()">AddCustomer</button>
</div>

查看代碼2：

<div class="container">
    <h2>View 2</h2>

Name:
<br/>
<input type="text" ng-model="filter.name"/>
<br/>
<ul>
  <li ng-repeat="cust in customers|filter:filter.name">{{cust}}</li>

</ul></div>

Answer 1

您只需要將功能放入控制器中即可...

app.controller('myCtrl',function($scope){
    $scope.customers=[
               {name:'JohnSmith',city:'Phonenix'}
               {name:'devsenny',city:'New York'}
               {name:'benny',city:'san Francisco'}];
    $scope.addCust=function(){
       $scope.customers.push(
       {
          name:$scope.newcustomer.name,
          city:$scope.newcustomer.city
       });
    };
});

Answer 2

在@Steeve Pitis響應的頂部，您需要在Web /應用服務器中而不是在瀏覽器中運行它

如何在Angular JS中配置視圖和控制器模塊

問題描述

2 個解決方案

解決方案1
1 2016-10-06 10:41:43

解決方案2
0 2016-10-06 10:59:24

如何在Angular JS中配置視圖和控制器模塊

問題描述

2 個解決方案

解決方案1 1 2016-10-06 10:41:43

解決方案2 0 2016-10-06 10:59:24

解決方案1
1 2016-10-06 10:41:43

解決方案2
0 2016-10-06 10:59:24