javascript - ng-controller 和 ui-view 不适用于同一元素

标签 javascript angularjs angular-ui-router

我正在使用 AngularJS 和 ui-router。我的代码在同一个元素上有 ng-controller 和 ui-view,但 Controller 没有被触发

http://plnkr.co/edit/UphvqV01R7m0WwlY67YA?p=preview

HTML:

<!DOCTYPE html>
<html ng-app="plunker">

  <head>
    <meta charset="utf-8" />
    <title>AngularJS Plunker</title>
    <script>document.write('<base href="' + document.location + '" />');</script>
    <link href="style.css" rel="stylesheet" />
    <script data-semver="1.2.7" src="http://code.angularjs.org/1.2.7/angular.js" data-require="angular.js@1.2.x"></script>
    <script src="//cdnjs.cloudflare.com/ajax/libs/angular-ui-router/0.2.0/angular-ui-router.js"></script>

    <script src="app.js"></script>
  </head>

  <body>
    <div ui-view="main" ng-controller="MainCtrl">
      <p>Hello {{name}}!</p>  
    </div>

  </body>

</html>

Javascript:

var app = angular.module('plunker', []);

app.config(['$stateProvider', '$urlRouterProvider', '$locationProvider', function($stateProvider, $urlRouterProvider, $locationProvider) {
  $stateProvider
    .state("home", {
      url: "^",
      resolve: {
        test: function() {
          alert("Triggered resolve home");
          return true;
        }
      }
    })
}]);

app.controller('MainCtrl', function($scope) {
  $scope.name = 'World';
});

你能帮忙修复它或解释原因吗?

最佳答案

您需要让您的主模块最终以某种方式依赖于'ui.router'。现在它不依赖于任何东西 ([])。

var app = angular.module('plunker', ['ui.router']);

关于javascript - ng-controller 和 ui-view 不适用于同一元素,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/21059749/

相关文章:

javascript - 在 function1() 内部调用 function2() 但它在 .subscribe() 之前被触发

javascript - 将 ng-repeat 中的值与 php 值进行比较

缺少服务的 Angular 库 HttpClient

javascript - 使用 href 属性时 ui-route 不起作用

javascript - 如何处理多个单独的 json 响应?

javascript - A-frame 显示鼠标指针和函数

javascript - 如何仅在单击选项卡时加载 DIV?

javascript - 如何在AngularJS中获取Html元素属性?

angularjs - Angular 用户界面路由器不起作用

Javascript - 聊天机器人