如何基于条件实例化ng-controller

jas*_*328 17 javascript angularjs ng-controller

我问过这个问题,但我提出的具体问题发生了巨大变化.

我有一段代码:

  <div ng-attr-controller="{{pings || 'PingsCtrl as pings' }}">
    <h1 ng-click="pings.press()">asdf</h1>
  </div>
Run Code Online (Sandbox Code Playgroud)

此代码注入两个html页面.一页已经调用PingsCtrl.另一个没有.我真的想保持这段代码DRY,我只想要一个上面的代码参考.

我如何编写上面的代码来生成ng-controllerif PingsCtrl尚未实例化.

这是两个html页面.

HTML

// First page
<html ng-app="coolApp">
  <div ng-controller="PingsCtrl as pings">
    <div ng-attr-controller="{{pings || 'PingsCtrl as pings' }}">
      <h1 ng-click="pings.press()">asdf</h1>
    </div>
  </div>
</html>

// Second page
<html ng-app="coolApp">
  <div ng-attr-controller="{{pings || 'PingsCtrl as pings' }}">
    <h1 ng-click="pings.press()">asdf</h1>
  </div>
</html>
Run Code Online (Sandbox Code Playgroud)

Javascript在这里:

angular.module('coolApp', [])

.controller('PingsCtrl', function() {
  var vm = this;

  vm.press = function() {alert(123)};
})
Run Code Online (Sandbox Code Playgroud)

怎么了,怎么解决这个问题?

Har*_*ris 7

只需使用服务.它实际上是在页面之间具有通用数据和功能的预期结构.

您尝试的部分问题是,无论您是否设法保留控制器,Angular都有自己的管理,不会跟随您,并且会在没有您的情况下刷新组件.你会碰到一些与$scope你正在寻找的页面实际上并不匹配的东西,最终会导致更多的问题而不是它的价值.