首页
学习
活动
专区
圈层
工具
发布
首页
学习
活动
专区
圈层
工具
MCP广场
社区首页 >问答首页 >角UI路由器和控制器继承中的子视图?

角UI路由器和控制器继承中的子视图?
EN

Stack Overflow用户
提问于 2015-09-22 15:55:01
回答 1查看 248关注 0票数 3

我有这样一个视图状态,有3个视图:

代码语言:javascript
运行
复制
    (function() {

  'use strict';

  angular.module('pb.tracker').config(function($stateProvider) {
    $stateProvider.state('tracker', {
        url: '/tracker',
        controller: 'TrackerController as tracker',
        data: {
          pageTitle: 'Parcel Tracker',
          access: 'public',
          bodyClass: 'tracker'
        },
        resolve: {
          HistoryResolve: function($log, MockDataFactory) {
            return MockDataFactory.query({
              filename: 'trackingdata'
            });
          }
        },
        views: {
          '': {
            templateUrl: 'modules/tracker/templates/tracker.html'
          },
          'controls@tracker': {
            templateUrl: 'modules/tracker/templates/tracker-controls.html'
          },
          'content@tracker': {
            templateUrl: 'modules/tracker/templates/tracker-details.html'
          }
        }
      });

  });

})();

我想对状态中的所有视图使用控制器TrackerController。我以为他们会简单地继承父母的遗产。

但是到目前为止,即使是一个简单的日志也没有显示在控制台中。控制器是

代码语言:javascript
运行
复制
    (function() {

  'use strict';

  angular.module('pb.tracker').controller('TrackerController', function($log, HistoryResolve) {

    var _this = this;

    // _this.packageHistory = HistoryResolve;

    $log.debug('foo');


  });

})();

所以,我的控制台应该读"foo“,是吗?控制台里什么都没有。没有错误。工作正常,视图加载模板。我只被卡在控制器上。我从来没碰到过这个。

UPDATE OK,我正在尝试定义父状态,并将控制器分配给它。然而,我在下面所做的就是在浏览器中一事无成。

代码语言:javascript
运行
复制
    (function() {

  'use strict';

  angular.module('pb.tracker').config(function($stateProvider) {
    $stateProvider.state('tracker', {
        url: '/tracker',
        abstract: true,
        controller: 'TrackerController as tracker',
        data: {
          pageTitle: 'Parcel Tracker',
          access: 'public',
          bodyClass: 'tracker'
        },
        resolve: {
          HistoryResolve: function($log, MockDataFactory) {
            return MockDataFactory.query({
              filename: 'trackingdata'
            });
          }
        }
      })
    .state('tracker.details', {
        url: '/tracker/details',
        views: {
          '': {
            templateUrl: 'modules/tracker/templates/tracker.html'
          },
          'controls@tracker': {
            templateUrl: 'modules/tracker/templates/tracker-controls.html'
          },
          'content@tracker': {
            templateUrl: 'modules/tracker/templates/tracker-details.html'
          }
        }
      });

  });

})();
EN

回答 1

Stack Overflow用户

回答已采纳

发布于 2015-09-22 16:06:30

当您定义命名视图(使用views属性,也称为“命名视图”)时,状态的模板属性将被每个命名视图覆盖。来自文档

如果定义了视图对象,则会忽略状态的templateUrl、模板和templateProvider。因此,在需要这些视图的父布局的情况下,可以定义包含模板的抽象状态,以及包含“视图”对象的布局状态下的子状态。

注意,模板总是与控制器配对。因此,由于它不使用模板属性,所以不需要它实例化控制器。你有两个选择:

  • 使用指定每个视图的控制器。这将为每个命名视图实例化一个控制器,可能不是您想要的。
  • 创建此状态的父状态,该状态是抽象的,并使用控制器。请注意,上面的状态没有子/父关系,它只是一个状态w/一些命名的视图。
票数 1
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/32721435

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档