Question

我在ng-repeat上有div，它显示控制器中数组的值。在浏览器中执行inspect元素时，会注释div。我的外部div上有ng-controller。

这是html文件：

    <!DOCTYPE html>
<html ng-app="myapp">
<head>
    <title></title>
        <script type="text/javascript" src="../js/angular.js"></script>
    <script type="text/javascript" src="../js/angular-route.js"></script>
     <script type="text/javascript" src="../js/controller.js"></script>
    <!-- <base href="localhost:5000/"/> -->
    <base href="/"/>

</head>
<body>


<div ng-controller="firstController">
    First name:<input type="text" ng-model="firstName"><br>
    Last name:<input type="" ng-model="lastName"><br>
    <input type="button" ng-click="loadView()" value="submit" name="">
    <p>{{firstName}}</p>
    <div ng-repeat="data in array">

            {{data.name}}

    </div>  
</div>
</body>
</html>

这是控制器：

    var app = angular.module('myapp',['ngRoute']);
// var app = angular.module('myapp',[]);

app.config(function($routeProvider,$locationProvider){
    $routeProvider.when('/index',{
        templateUrl:'./view/index.html',
        controller:'firstController'
    })
    .when('/second/:firstName/:lastName',{
        templateUrl:'./view/second.html',
        controller:'secondController'
    })
    .otherwise({redirectTo:'/index'})
    $locationProvider.html5Mode(true);
})

app.controller('firstController',function($scope,$location){
    $scope.firstName = "";
    $scope.lastName="";

    $scope.loadView = function(){
        $location.path('/second/'+$scope.firstName+"/"+$scope.lastName);
    }

var arrays = [
            {name:ab}, {name:ba}, {name:ac}, {name:ca}
        ];
    $scope.array = arrays;
})
.controller('secondController',function($scope,$routeParams){
    $scope.firstName = $routeParams.firstName;
    $scope.lastName = $routeParams.lastName;
})

此外，当我尝试在按钮点击时导航到second.html，调用控制器中的loadView()时，我看到地址栏中的网址已更改，但仍显示内容第一个html（index.html）。

Answer 1

除非数组是变量，否则数组的值应该是单引号。因此，只需执行{name:ab}

而不是{name:'ab'}

查看代码段

＆＃13;

    var app = angular.module('myapp', []);
     // var app = angular.module('myapp',[]);

     app.controller('firstController', function($scope, $location) {
        $scope.firstName = "";
        $scope.lastName = "";

        $scope.loadView = function() {
          $location.path('/second/' + $scope.firstName + "/" + $scope.lastName);
        }

        var arrays = [{
          name: 'ab'
        }, {
          name: 'ba'
        }, {
          name: 'ac'
        }, {
          name: 'ca'
        }];
        $scope.array = arrays;
      })
      .controller('secondController', function($scope, $routeParams) {
        $scope.firstName = $routeParams.firstName;
        $scope.lastName = $routeParams.lastName;
      })

＆＃13;

<!DOCTYPE html>
<html ng-app="myapp">

<head>
  <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script>

</head>

<body>


  <div ng-controller="firstController">
    First name:
    <input type="text" ng-model="firstName">
    <br>Last name:
    <input type="" ng-model="lastName">
    <br>
    <input type="button" ng-click="loadView()" value="submit" name="">
    <p>{{firstName}}</p>
    <div ng-repeat="data in array">

      {{data.name}}

    </div>
  </div>
</body>

</html>

＆＃13;

Answer 2

当对象为空时，div会被注释。

确保您的$scope.object包含您想要的数据。

ng-repeat在浏览器中得到注释

2 个答案: