双向绑定在AngularJS指令中不起作用

时间:2013-09-18 13:35:36

标签: angularjs angularjs-directive angularjs-scope

我的网页上有以下HTML

<div data-personselect="" data-ng-model="selectedPersonName" data-person="currentOwnership.Person" data-id="currentOwnership.PersonId"></div>

这是使用我已定义的person指令:

'use strict';

define(['app'], function (app) {
    app.directive('personselect', function (personDataService) {
        var link = function ($scope, $element, $attr) {
            $scope.names = [];

            $scope.getNames = function (name) {
                return personDataService.FullNameSearch({ name: name, pageSize: 10 })
                    .then(function (sourceData) {
                        $scope.names = sourceData;
                        return sourceData;
                    }, function (error) {
                        config.logger.error(config.errorMessage("search"));
                    });
            };

            $scope.selectItem = function () {
                //$scope.$parent.$parent[$attr.person.split('.')[0]][$attr.person.split('.')[1]]
                $scope.person = findPerson($scope[$attr.ngModel]);
                $scope.id = $scope.person == undefined ? undefined : $scope.person.id;
            };

            function findPerson(itemToFind) {
                var item = _.find($scope.names, function (member) {
                    return member.name == itemToFind;
                });
                if (item == undefined) return undefined;
                return item;
            }

        };


        return {
            restrict: 'A',
            replace: true,
            scope: {
                id: '=',
                person: '=',
                defaultName: '='
            },
            templateUrl: 'app/views/templates/people/personSelect.html',
            link: link
        };
    });
});

您可以在底部看到我已经定义了一个隔离范围,其中包含2个属性1用于id,1个用于person。这个独立的范围是使用=所以它应该双向绑定到从页面上的html设置的属性; currentOwnership.Person和currentOwnership.PersonId在我的例子中。

现在,当我选择一个人时,正在调用$ scope.selectItem方法,并且我正确设置$ scope.person和$ scope.id属性,但是父范围中的currentOwnership.Person和currentOwnership.PersonId属性没有被改变。

我在这里缺少什么

1 个答案:

答案 0 :(得分:0)

恕我直言,问题在于您的父作用域,因为它不包含currentOwnership.PersonId项。换句话说,您将模板范围属性与父范围的不存在属性绑定。

我已更新您的fiddle,包括控制器范围内的currentOwnership.PersonId属性,看起来有效。