javascript - AngularJS 一个模板具有多个 Controller

标签 javascript angularjs

我正在使用 UI-Router 模块来配置状态。我有多个状态正在工作并路由到 Controller (TasksCtrl)并在模板(TasksPendingTable)中渲染。我需要让另一个 Controller (TaskSearchCtrl)使用这个模板。是否可以?这是我的状态配置。

/// <reference path="E:\Work\myApp\AngularSPA\AngularSPA\Views/TasksEndedTable.cshtml" />
/// <reference path="E:\Work\myApp\AngularSPA\AngularSPA\Views/TasksEndedTable.cshtml" />
'use strict';

angular.module('myApp', ['ui.router', 'myApp.controllers', 'myApp.filters', 'ui.bootstrap'])
    .config(['$stateProvider', '$locationProvider',
      function ($stateProvider, $locationProvider)
      {
        $stateProvider
            .state('tasksPending', {
              url: '/tasksPending',
              templateUrl: 'views/TasksPendingTable.cshtml',
              controller: 'TasksCtrl'
            })
            .state('tasksOverdue', {
              url: '/tasksOverdue',
              templateUrl: 'views/TasksPendingTable.cshtml',
              controller: 'TasksCtrl'
            })
            .state('tasksCompleted', {
              url: '/tasksCompleted',
              templateUrl: 'views/TasksPendingTable.cshtml',
              controller: 'TasksCtrl'
            })
            .state('tasksCancelled', {
              url: '/tasksCancelled',
              templateUrl: 'views/TasksPendingTable.cshtml',
              controller: 'TasksCtrl'
            })
            .state('taskSearchForm', {
              url: '/tasksSearchForm',
              templateUrl: 'views/taskSearch.cshtml',
              controller: 'TaskSearchCtrl'
            })
            .state('taskSearchResult', {
              url: '/tasksSearchResult',
              templateUrl: 'views/TasksPendingTable.cshtml',
              controller: 'TaskSearchCtrl'
            })
            .state('taskEdit', {
              url: '/tasks/:id/Edit',
              templateUrl: 'views/tasksEdit.cshtml',
              controller: 'TaskEditCtrl'
            })
            .state('taskAdd', {
              url: '/tasks/Add',
              templateUrl: 'views/taskAdd.cshtml',
              controller: 'TaskAddCtrl'
            })

            // Otherwise routes -----------------------------
            .state('otherwise', {
              url: '*path',
              templateUrl: 'views/404',
              controller: 'Error404Ctrl'
            });

        $locationProvider.html5Mode(true);

      }]);

最佳答案

如果您想有两个 Controller ,那么您可能应该考虑使用 provider ,例如工厂或服务。 Controller 可以有多个注入(inject)工厂,因此您可以将大部分逻辑包含在工厂中而不是 Controller 内部。 Here是我在制作 Angular 应用程序时经常使用的风格指南,它包含有关如何正确设置工厂的信息。我希望这有帮助!

关于javascript - AngularJS 一个模板具有多个 Controller ,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/28686462/

相关文章:

javascript - 通过减去属性来获取两个对象的差异

JavaScript 案例 : "look at" + item

javascript - Angular JS - 使用过滤器检查单个值

javascript - 使用 .then 不会触发服务方法

javascript - 如何使用在 ui-router 解析中发出 Ajax 请求的工厂/服务?

javascript - nodejs异步嵌套调用

javascript - Javascript中有&逻辑运算符吗

javascript - Backbone collection.reset 添加了一个不正确的模型

javascript - Controller 中的函数未被调用

javascript - 在单页 MEAN 应用程序中优雅地隐藏导航栏。