Question

我需要帮助尝试使用Angular JS将以下变量绑定到HTML属性。在我的控制器文件中，我有这个

controller.js

$scope.errorDialog = function(errorTitle, errorMessage){
      $scope.errorTitle = errorTitle;
      $scope.errorMessage = errorMessage;
      $("#dialog-confirm").dialog('open');
}

errorTitle和errorMessage参数都在另一个函数中设置。

在我的html文件中，我有这个错误消息框（使用Jquery UI）

abc.html

<div title="{{errorTitle}}" id="dialog-confirm" >
      <p><span class="ui-icon ui-icon-alert" style="float:left; margin:12px 12px 20px 0;"></span>{{errorMessage}}</p>
</div>

由于某种原因，标题不会显示。我试过把它改成了 NG-ATTR-标题=＆＃34; {{errorTitle}}＆＃34;但那也不起作用。我还试图在title属性中使用一个函数并返回errorTitle的值，但这似乎也不起作用。

Answer 1

我可以在这里看到两个可能的问题：

您确定要与对话框共享控制器的$范围吗？

如果控制器无法访问创建对话框的div，这意味着它不是控制器根元素的子树子树中的DOM节点，它将不会显示属性（并且不会出现错误））

你在哪里调用$ scope.errorDialog？

如果您在$ digest循环之外运行该调用，您可以在设置属性后调用$scope.$apply来解决此问题。这不是最好的解决方案，最好以下列方式包装此函数的调用

$scope.$apply(function() {
    $scope.errorDialog('title', 'message');
})

这将允许AngularJS最终拦截执行$scope.errorDialog

Angular js绑定title属性

1 个答案: