Question

我可能会对此完全错误，所以我愿意接受任何建议。谢谢！

jQuery事件监听器在单击时将一个元素传递给我的quickComposeFactory（这是我现在唯一无法改变的部分:(）。

$('#results').on('click', '.toggleQuickCompose', function() {
    quickComposeFactory.init($(this).parents('.isotope-item'));
});

我的Angular工厂评估elem并填充我的控制器应该能够在$ scope中看到的dynamicContent对象。

app.factory('quickComposeFactory', function() {

    var dynamicContent = {};

    return {

        getDynamicContent : dynamicContent,

        init: function(elem) {
            } else if (elem.attr('phone')){
                dynamicContent.phone = elem.attr('phone');
                $("#QuickComposePhone").modal("show");
            } else {
                $("#QuickComposeFail").modal("show");
            }
        }
    };
});

由于我将工厂导入控制器，我认为数据绑定会像往常一样工作。问题是，$ scope.dynamicContent由于某种原因永远不会更新？

htsApp.controller('quickComposeController', ['$scope', 'quickComposeFactory', function($scope, quickComposeFactory){

    $scope.dynamicContent = quickComposeFactory.getDynamicContent;

}]);

因此我的bootstrap模式不会更新。帮助

<div ng-controller="quickComposeController" class="modal hide fade" data-backdrop="false">
    <div class="modal-header">
        <h3 id="myModalLabel">Call or Text</h3>
    </div>
    <div class="modal-body">
    <div>Seller did not include an email.  Please contact:</div>
        <h4>{{dynamicContent.phone}}</h4>
    </div>
    <div class="modal-footer">
        <button class="btn btn-default" data-dismiss="modal" aria-hidden="true">Close</button>
    </div>
</div>

Answer 1

Demo Plunker

需要修复两件事：

如果您的服务存储对模型的引用，并且该模型绑定到范围，那么您应该使用angular.copy来保留引用：
```
init: function(qcObj) {
  if (qcObj.phone) {
    alert(qcObj.phone);
    angular.copy(qcObj, newQuickCompose)
  }
}
```

由于您正在处理jQuery click事件，因此需要调用$ apply来触发摘要周期：

function getPhoneFromElem() {
  $scope.$apply(function()  {
      $scope.dynamicContent = {
         phone: 1234567
      }
      quickComposeFactory.init($scope.dynamicContent);

  });
}

如何从Angular工厂更新视图

1 个答案: