Question

我开始学习 AngularJS ，但我一直坚持创建自己的服装指令。

所以，首先，我使用 yeoman项目来生成AngularJS项目，这是我的出发点。

现在，到主题 -

我有以下代码：

app.js ：

myapp.directive('userinfo', function() {
        var directive = {};

        directive.restrict = 'E';
        directive.template = '<b>User: {{ user.firstName }} {{ user.lastName}}</b>';

        directive.scope = {
            user : '='/*, editing: false*/
        };

        return directive;
    });

的index.html ：

<body ng-app="proj2App" ng-controller="MainCtrl">
...
<userinfo user="users[0]"> </userinfo>
...
</body>

main.js ：

angular.module('proj2App')
  .controller('MainCtrl', function ($scope) {
    $scope.users = [
        { firstName : 'John', lastName: 'Doe'}
                     ];
  });

我的问题似乎在app.js中找到了我定义directive.scope的行。每当它是这样的时候：

        directive.scope = {
            user : '='/*, editing: false*/
        };

没有问题，一切正常......但是，当我删除评论块时，它看起来像那样：

        directive.scope = {
            user : '=', editing: false
        };

它不起作用 - 页面不会显示模板，而角度会抛出以下错误，这对我来说绝对没有说明：

**TypeError**: undefined is not a function
    at http://localhost:9000/bower_components/angular/angular.js:6436:30
    at forEach (http://localhost:9000/bower_components/angular/angular.js:331:20)
    at parseIsolateBindings (http://localhost:9000/bower_components/angular/angular.js:6435:5)
    at http://localhost:9000/bower_components/angular/angular.js:6494:49
    at forEach (http://localhost:9000/bower_components/angular/angular.js:323:20)
    at Object.<anonymous> (http://localhost:9000/bower_components/angular/angular.js:6480:13)
    at Object.invoke (http://localhost:9000/bower_components/angular/angular.js:4182:17)
    at Object.enforcedReturnValue [as $get] (http://localhost:9000/bower_components/angular/angular.js:4035:37)
    at Object.invoke (http://localhost:9000/bower_components/angular/angular.js:4182:17)
    at http://localhost:9000/bower_components/angular/angular.js:4000:37

有人知道这里发生了什么吗？

Answer 1

在editing功能

中设置link变量

myapp.directive('userinfo', function () {
    var directive = {};

    directive.restrict = 'E';
    directive.template = '<b>User: {{ user.firstName }} {{ user.lastName}}</b>';

    directive.scope = {
        user: '='
    };

    directive.link = function (scope) {
        scope.editing = false;
    };

    return directive;
});

AngularJS指令范围似乎只接受一个参数

1 个答案: