目标 ng-if 外部控制器答案

【问题标题】：Target ng-if outside controller目标 ng-if 外部控制器
【发布时间】：2016-04-29 21:53:23
【问题描述】：

我的应用有反馈功能，

#feedback
  %h3.button
    %a{"ui-sref" => ".feedback", "ng-click" => "feedbackActive=!feedbackActive;"}
      Feedback
  #feedback-container{"ng-if" => "feedbackActive"}
    %div{"ui-view" => "feedback"}

#feedback-container 有一个ng-if，以便仅在需要时加载内容。 %a 有一个 ng-click，可以在 feedbackActive 状态的真/假之间切换。

这很好用。但是在我的 ui 视图中，我加载了一个模板。在该模板中有一个发送按钮，该按钮具有链接到feedbackCtrl 的send() 函数，

$scope.send = function(){
  console.log ('send')
  console.log ($scope.feedbackForm)

  createFeedback.create({
    name:      $scope.feedbackForm.name,
    feedback:  $scope.feedbackForm.feedback
  })
  $scope.feedbackActive = false;
}

它可以正常运行代码，但不会给 feedbackActive 提供 false 值，因此什么也不会发生。

如何从控制器外部移除切换ng-if？

【问题讨论】：

开始使用控制器，因为它应该解决这个问题。
你能提供合适的条件代码吗？
@Viplock 你是什么意思？这是我所有的反馈功能代码。

标签： angularjs

【解决方案1】：

这是一个经典的范围界定问题。您的控制器范围是 ng-if 指令范围的子级。一种选择是使用$scope.$parent 在父作用域上设置变量。

$scope.send = function(){
  console.log ('send')
  console.log ($scope.feedbackForm)

  createFeedback.create({
    name:      $scope.feedbackForm.name,
    feedback:  $scope.feedbackForm.feedback
  })
  $scope.$parent.feedbackActive = false;
}

另一种选择是利用原型继承。在父控制器中，初始化一个对象。

$scope.x = {}; //parent scope

在视图控制器中，设置继承对象的属性。

$scope.x.feedbackActive = false; //child scope

当然还有你的 HTML

<feedback-container ng-if="x.feedbackActive">

【讨论】：