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不起作用

回答

相關問題