Javascript AngularJS:使用'修改指令中父范围的模型=xxx和x27;隔离范围?

Javascript AngularJS:使用'修改指令中父范围的模型=xxx和x27;隔离范围?,javascript,angularjs,angularjs-directive,angularjs-scope,angularjs-ng-repeat,Javascript,Angularjs,Angularjs Directive,Angularjs Scope,Angularjs Ng Repeat,我有一个Angular指令,允许呈现用户,并创建一个链接以查看用户配置文件,声明为: .directive('foafPerson', function() { return { restrict: 'E', templateUrl: 'templates/person.html', scope: { personModel: '=', onClickBindTo: '=', onPersonClick:

我有一个Angular指令,允许呈现用户,并创建一个链接以查看用户配置文件,声明为:

.directive('foafPerson', function() {
    return {
      restrict: 'E',
      templateUrl: 'templates/person.html',
      scope: {
        personModel: '=',
        onClickBindTo: '=',
        onPersonClick: '&'
      }
    };
如您所见,我正在尝试两种解决方案来访问和加载完整的用户配置文件:
onClickBindTo
onPersonClick

我这样使用它来呈现一组人+他们的朋友:

// display the current user
<foaf-person person-model="person" on-person-click="changeCurrentProfileUri(person.uri)" on-click-bind-to="currentProfileUri"></foaf-person>

// display his friends
<div class="profileRelationship" ng-repeat="relationship in relationships">
    <foaf-person person-model="relationship" on-person-click="changeCurrentProfileUri(relationship.uri)" on-click-bind-to="currentProfileUri"></foaf-person>
</div>
所以要修改父范围的模型,我们需要使用父范围函数吗


顺便说一下,通过传递带有
的表达式,我尝试了另一种解决方案:不使用在控制器作用域中声明的函数:

<foaf-person person-model="relationship" on-person-click="currentProfileUri = relationship.uri"></foaf-person>

我对Angular很陌生,并且到处都知道使用隔离作用域允许与父作用域进行双向数据绑定,因此我不理解为什么我的更改不会传播到父作用域,并且除非我使用作用域函数
changeCurrentProfileUri


有人能解释一下它是如何工作的吗?

在您的示例中,作用域层次结构如下所示:

controller scope 
    ng-repeat scope
        foaf-person scope
因此,当您为“currentProfileUri”声明双向绑定时,它实际上绑定到由ng repeat创建的范围,而不是由控制器创建的范围,并且当您的代码更改onClickBindTo的值时,angularjs在ng repeat范围中执行“currentProfileUri=newValue”

解决方案是对双向绑定使用对象而不是原语值——在这种情况下,作用域继承总是以正确的方式工作。我的意思是:

// display the current user
<foaf-person person-model="person" on-click-bind-to="currentProfile.uri"></foaf-person>

// display his friends
<div class="profileRelationship" ng-repeat="relationship in relationships">
    <foaf-person person-model="relationship" on-click-bind-to="currentProfile.uri"></foaf-person>
</div>
//显示当前用户
//展示他的朋友

我已经准备好了

是的,我忘了我找到了这里描述的这个问题的答案:
$scope.currentProfileUri = 'https://my-profile.eu/people/deiu/card#me';

$scope.$watch('currentProfileUri', function() {
  console.debug("currentProfileUri changed to "+$scope.currentProfileUri);
  loadFullProfile($scope.currentProfileUri);
})

$scope.changeCurrentProfileUri = function changeCurrentProfileUri(uri) {
  console.debug("Change current profile uri called with " + uri);
  $scope.currentProfileUri = uri;
}
controller scope 
    ng-repeat scope
        foaf-person scope
// display the current user
<foaf-person person-model="person" on-click-bind-to="currentProfile.uri"></foaf-person>

// display his friends
<div class="profileRelationship" ng-repeat="relationship in relationships">
    <foaf-person person-model="relationship" on-click-bind-to="currentProfile.uri"></foaf-person>
</div>