ui-router $ stateProvider.state.controller不起作用

SignupCtrl控制器未绑定到注册视图。即使当我按提交按钮它不起作用。但是，当我把ng-controller = SignupCtrl放在窗体标签中时它就起作用了。只是想知道为什么ui路由器状态参数控制器不工作。

的index.html

<html class="no-js" ng-app="mainApp" ng-controller="MainCtrl"> 
    <head> .... 
    </head> 
    <body class="home-page"> 
      <div ui-view="header"></div> 
     <div ui-view="content"></div> 
     <div ui-view="footer"></div> 
...

signup.html

<div class="form-container col-md-5 col-sm-12 col-xs-12"> 
    <form class="signup-form"> 
    <div class="form-group email"> 
     <label class="sr-only" for="signup-email">Your email</label> 
     <input id="signup-email" type="email" ng-model="user.email" class="form-control login-email" placeholder="Your email"> 
    </div> 
    <!--//form-group--> 
    <div class="form-group password"> 
     <label class="sr-only" for="signup-password">Your password</label> 
     <input id="signup-password" type="password" ng-model="user.password" class="form-control login-password" placeholder="Password"> 
    </div> 
    <!--//form-group--> 
    <button type="submit" ng-click="createUser()" class="btn btn-block btn-cta-primary">Sign up</button> 
    <p class="note">By signing up, you agree to our terms of services and privacy policy.</p> 
    <p class="lead">Already have an account? <a class="login-link" id="login-link" ui-sref="login">Log in</a> 
    </p> 
    </form> 
</div><!--//form-container-->

app.js

angular 
    .module('mainApp', [ 
    'services.config', 
    'mainApp.signup' 
    ]) 
    .config(['$urlRouterProvider', function($urlRouterProvider){ 
    $urlRouterProvider.otherwise('/'); 

    }])

signup.js

'use strict'; 

/** 
* @ngdoc function 
* @name mainApp.signup 
* @description 
* # SignupCtrl 
*/ 
angular 
.module('mainApp.signup', [ 
    'ui.router', 
    'angular-storage' 
    ]) 
.config(['$stateProvider', function($stateProvider){ 
    $stateProvider.state('signup',{ 
    url: '/signup', 
    controller: 'SignupCtrl', 
    views: { 
     'header': { 
     templateUrl: '/pages/templates/nav.html' 
     }, 
     'content' : { 
     templateUrl: '/pages/signup/signup.html' 
     }, 
     'footer' : { 
     templateUrl: '/pages/templates/footer.html' 
     } 
    } 
    }); 
}]) 
.controller('SignupCtrl', function SignupController($scope, $http, store, $state) { 

    $scope.user = {}; 

    $scope.createUser = function() { 
    $http({ 
     url: 'http://localhost:3001/users', 
     method: 'POST', 
     data: $scope.user 
    }).then(function(response) { 
     store.set('jwt', response.data.id_token); 
     $state.go('home'); 
    }, function(error) { 
     alert(error.data); 
    }); 
    } 

});

来源

2015-05-03 user1595858

控制器将被绑定到'UI-view'指令。 [UI-视图（https://github.com/angular-ui/ui-router/wiki/Quick-Reference#ui-view）。你有没有在你的index.html？你的'注册'配置似乎也错过了template或templateUrl属性。 – Michael

刚刚更新了index.html。 templateUrl正在查看 – user1595858

有a working plunker。首先，检查这个问答&答：

Are there different ways of declaring the controller associated with an Angular UI Router state

这里我们可以看到，该

控制器不不属于state。它属于view！

这应该是状态定义：

$stateProvider.state('signup',{ 
    url: '/signup', 
    //controller: 'SignupCtrl', 
    views: { 
     'header': { 
     templateUrl: 'pages/templates/nav.html' 
     }, 
     'content' : { 
     templateUrl: 'pages/signup/signup.html', 
     controller: 'SignupCtrl', 
     }, 
     'footer' : { 
     templateUrl: 'pages/templates/footer.html' 
     } 
    } 
});

检查它here

来源

2015-05-03 16:44:18

您需要一个模板来绑定控制器。

在文档ui-router Controllers

控制器

可以分配一个控制器到您的模板。警告：如果未定义模板，控制器将不会实例化。

来源

2015-05-03 15:18:01 Michael

我现在添加了模板：...，会有帮助吗？我没有看到任何变化 – user1595858

我认为你还需要在index/parent.html中使用'ui-view'指令来将模板与其控制器绑定。 – Michael

ui-router $ stateProvider.state.controller不起作用

回答

相关问题