Angular JS 控制器之间的共享函数

Question

我有这个代码： http://jsbin.com/gazajunacu/1/edit?html,js,output

       angular.module('app', [])
        .service('greeting', function Greeting() {
          var greeting = this;
          greeting.message = '<strong>Default 2</strong>';
        })
        .controller('FirstCtrl', function ($sce, greeting) {
          var first = this;

          first.greeting = $sce.trustAsHtml(greeting);  
        })
        .controller('SecondCtrl', function (greeting) {
          var second = this;

          second.greeting = greeting;  
        })

而且我无法让它为第一个控制器吐出 html。我无法让它工作。请检查脚本中缺少的内容。

谢谢。

Answer 1

这应该有帮助

angular.module('app', [])
.service('greeting', function Greeting() {
    var greeting = this;
    greeting.message = '<strong>Default 2</strong>';
})
.controller('FirstCtrl', function (greeting) {
    var me = this;
    me.greeting = greeting;  
})
.controller('SecondCtrl', function ($scope,greeting) {

    var me = this;
    me.greeting = greeting;  
})

;

下一行造成了您的错误

first.greeting = $sce.trustAsHtml(greeting);

Answer 2

问题是您的库中没有包含 angular-sanitize.js。

实现该目标的正确方法是：http://jsbin.com/rowukowuba/1/edit

在页面中包含 angular-sanitize.js 并在 html 页面中使用 ng-bind-html 指令。

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.0-beta.5/angular-sanitize.js"></script>

<div>
  <span ng-bind-html="greeting"> </span> World
</div>
<div ng-controller="SecondCtrl as second">
  <span ng-bind-html="greeting.message"> </span> in Second
</div>
</body>

在 javascript 中，只需将 html 代码放在范围内并确保包含 ngSanitize（我调整了你的代码）：

angular.module('app', ['ngSanitize'])
  .service('greeting', function Greeting() {
    var greeting = this;
    greeting.message = '<strong>Default 2</strong>';
  })
  .controller('FirstCtrl', function ($scope, greeting) {
  $scope.greeting = '<strong>Default 2</strong>';
  })
  .controller('SecondCtrl', function ($scope, greeting) {

    $scope.greeting = greeting;  
  });

Angular JS 控制器之间的共享函数

Angular JS Shared functions between controllers

angularjs

angularjs-controller