angularjs與HTML標記解決衝突2個納克控制器

Question

這裏是我的： config.router.js

app.config(['$stateProvider', '$urlRouterProvider', '$controllerProvider', '$compileProvider', '$filterProvider', '$provide', '$ocLazyLoadProvider', 'JS_REQUIRES', 
function ($stateProvider, $urlRouterProvider, $controllerProvider, $compileProvider, $filterProvider, $provide, $ocLazyLoadProvider, jsRequires) { 

    app.controller = $controllerProvider.register; 
    app.directive = $compileProvider.directive; 
    app.filter = $filterProvider.register; 
    app.factory = $provide.factory; 
    app.service = $provide.service; 
    app.constant = $provide.constant; 
    app.value = $provide.value; 

    // LAZY MODULES 

    $ocLazyLoadProvider.config({ 
     debug: false, 
     events: true, 
     modules: jsRequires.modules 
    }); 

    // APPLICATION ROUTES 
    // ----------------------------------- 

    $urlRouterProvider.otherwise('/login/signin'); 
    // 
    // Set up the states 
    $stateProvider.state('app', { 
     url: "/app", 
     templateUrl: "assets/views/app.html", 
     resolve: loadSequence('modernizr', 'moment', 'angularMoment', 'uiSwitch', 'perfect-scrollbar-plugin', 'toaster', 'ngAside', 'vAccordion', 'sweet-alert', 'chartjs', 'tc.chartjs', 'oitozero.ngSweetAlert', 'chatCtrl'), 
     abstract: true 
    }).state('app.dashboard', { 
     url: "/dashboard", 
     templateUrl: "assets/views/dashboard.html", 
     resolve: loadSequence('jquery-sparkline', 'dashboardCtrl'), 
     title: 'Dashboard', 
     ncyBreadcrumb: { 
      label: 'Dashboard' 
     } 
    }) 
... 

loginCtrl.js

app.controller('LoginCtrl', ["$scope", "alert", "auth", "$state", "$auth", "$timeout", function ($scope, alert, auth, $state, $auth, $timeout) { 
    $scope.submit = function() { 
     $auth.login({ 
      email: $scope.email, 
      password: $scope.password 
     }) 
      .then(function(res) { 
       var message = 'Thanks for coming back ' + res.data.user.email + '!'; 
       if (!res.data.user.active) 
       {$auth.logout(); 
        message = 'Just a reminder, please activate your account soon :)';} 
       alert('success', 'Welcome', message); 
       return null; 
      }) 
      .then(function() { 
       $timeout(function() { 
        $state.go('main'); 
       }); 
      }) 

      .catch(handleError); 
    } // submit function for login view 
    function handleError(err) { 
     alert('warning', 'oops there is a problem!', err.message); 
    } 
}]); 

main.js

var app = angular.module('myApp', ['my-app']); 
app.run(['$rootScope', '$state', '$stateParams', 
function ($rootScope, $state, $stateParams) { 

    // Attach Fastclick for eliminating the 300ms delay between a physical tap and the firing of a click event on mobile browsers 
    FastClick.attach(document.body); 

    // Set some reference to access them from any scope 
    $rootScope.$state = $state; 
    $rootScope.$stateParams = $stateParams; 

    // GLOBAL APP SCOPE 
    // set below basic information 
    $rootScope.app = { 
     name: 'My App', 
     author: 'example author', 
     description: 'My Platform', 
     version: '1.0', 
     year: ((new Date()).getFullYear()), 
     isMobile: (function() { 
      var check = false; 
      if (/Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent)) { 
       check = true; 
      }; 
      return check; 
     })() 
    }; 
    $rootScope.user = { 
     name: 'Peter', 
     job: 'ng-Dev' 

    }; 
}]); 

的問題是，當我添加ng-controller="loginCtrl"將我登錄時的div上登錄的HTML文件，它的工作原理。但我有另一個div登錄div下面：

<div class="copyright" > 
    {{app.year}} &copy; {{ app.name }} by {{ app.author }}. 
</div> 

這不行！但是，我有一個類似的登錄DIV以上，它的工作原理：

<div class="logo"> 

    <img ng-src="{{app.layout.logo}}" alt="{{app.name}}"/> 
</div> 

問題出在哪裏？如何解決它？ 感謝

Answer 1

如果你正在使用的角度ui-router，這不是neccessary手動添加ng-controller="loginCtrl"到您的DIV，而不是添加controller財產您$stateProvider.state

例如：

.state('app.dashboard', { 
     url: "/dashboard", 
     templateUrl: "assets/views/dashboard.html", 
     title: 'Dashboard', 
     controller: 'dashboardCtrl', 
     resolve: { 
        deps: ['$ocLazyLoad', function ($ocLazyLoad) { 
         return $ocLazyLoad.load('path/to/your/controller.js'); 
        }] 
       }, 
     ncyBreadcrumb: { 
      label: 'Dashboard' 
     } 
    }) 

當你改變你的狀態一般意見改變，這是正確的點？即時設置控制器可能無法按預期工作。

結帳documentation