AngularJS UI.Router未显示初始模板



我有一个使用ui-router的AngularJS应用程序,当我访问以下URL http://localhost:63342/uirouter/uirouter/custylogin -loute配置它必须显示custylogin.html页面,但没有显示404错误页面

在上述URL UIROUTER中是应用程序名称,/CustomLogin是州的URL。

有人可以帮助我解决这个问题...请

下面是PLNKR URL

https://plnkr.co/edit/spor9iuwwsaixnbfnbox?p=preview

以下是我的文件

baseapp.js

angular.module('baseApp',['baseApp.routes']);

baseapp.routes.js

angular.module('baseApp.routes',['ui.router'])
    .config(['$stateProvider','$urlRouterProvider','$httpProvider',function($stateProvider,$urlRouterProvider,$httpProvider){
    console.log("in view");
    $stateProvider
        .state("login",{
            url:'/customlogin',
            templateUrl:'customlogin.html',
            controller:'ContactLoginCtrl'
        })
    $urlRouterProvider.otherwise("/customlogin");
}]) ;

Contactloginctrl.js

angular.module('baseApp')
.controller('ContactLoginCtrl', ['$scope',function($scope){
    console.log("in the controller")
}])

customLogin.html

<html lang="en" ng-app="baseApp">
<body>
<form name="contactLogin" ng-controller="ContactLoginCtrl"  ng-submit="authenticate(userModel)">
    <label  for="name" >UserName:</label>
    <input  type="text" ng-model="userModel.username" /></br>
    </br>
    <label for="password" >PassWord:&nbsp;</label>
    <input type="password" ng-model="userModel.password"  />
    </br>
    </br>
    <button type="submit"  name="Login" >Login</button>
</form>
<script src="angular.min.js"></script>
<script src="angular-ui-router.min.js"></script>
<script src="baseApp.js"></script>
<script src="baseApp.routes.js"></script>
</body>
</html>

除其他调整外,最重要的是 - 为状态具有 target 。我们需要:

<div ui-view></div>

有调整并有效的plunker

最新更新