Angular UI-Router与定义的状态不匹配

时间:2015-08-21 09:08:29

标签: javascript regex angularjs angular-ui-router

我正在使用public List<Checklist> Provide() { List<Checklist> checklists = new List<Checklist>(); using (var reader = ExcelReaderFactory.CreateOpenXmlReader(m_Stream)) { while (reader.Read()) { Checklist checklist = new Checklist(); checklist.Description = reader.GetString(1); checklist.View = reader.GetString(2); checklist.Organ = reader.GetString(3); checklists.Add(checklist); } return checklists; } } 模块进行路由。我有两种状态,路由器应该与网址匹配:

UI-Router

我也设置了默认路线:

// Dashboard
.state('dashboard', {
    url: "/dashboard",
    templateUrl: "dashboard/views/index.html",
    controller: "DashboardController",
    ...
})

// Users
.state('users', {
    url: "/users",
    templateUrl: "users/views/index.html",
    controller: "UsersController",
    ...
})

// Single User
.state('users.id', {
    url: "/{id:^[a-z0-9_-]{3,16}$}",
    templateUrl: "users/views/show.html",
    controller: "UserController",
    ...
})

当我转到$urlRouterProvider.otherwise("/dashboard");

时,我希望路由器与用户 state匹配

并在我转到http://127.0.0.1:8000/app/#/users时匹配用户 state

问题:

用户状态正常,但用户状态URL未匹配并重定向到默认状态。有什么问题?

2 个答案:

答案 0 :(得分:1)

a working example

尝试使用此正则表达式 def:

  .state('users.id', { 
      url: "/{id:(?:[a-z0-9_-]{3,16})}",

这些链接可以使用

  <a href="#/users">
  <a href="#/users/testuser">

这将转到

  <a href="#/users/xx">

一些灵感可能是found here

如果我们想要说明'userss.id&#39;直接,我们只需要使用正确的电话。在this extended plunker中,我们可以看到它可以这样做:

// working
<a ui-sref="users">
<a ui-sref="users.id({id:'testword'})">
// not working - id does not fit - otherwise is used
<a ui-sref="users.id({id:'not-working simply too long'})">

$state.go('users.id', {id:'testword'})

相同

检查here

答案 1 :(得分:0)

以下是我过去如何做到这一点的一个例子。也许它会帮助你。

app.config(['$stateProvider', '$urlRouterProvider',
        function ($stateProvider, $urlRouterProvider,$rootScope,$cookieStore) {
            $urlRouterProvider.otherwise("/login");
            $stateProvider
              .state('login', {
                  url: '/login',
                  title: 'Login',
                  templateUrl:'views/loginView.html',
                  controller: 'loginCtrl',
                  resolve: resolver($rootScope),

              })
              .state('account', {
                  url: '/account',
                  title: 'My Account',
                  accessLevel: 2,
                  resolve: resolver($rootScope,$cookieStore),   
                  views: {
                    'navigation': {
                         templateUrl: 'views/navigationView.html',
                         controller: 'navigationCtrl'
                    },
                    'content': {
                        templateUrl: 'views/contentView.html',
                        controller: 'navigationCtrl'
                    }
                 }            
              })
              .state('account.dashboard', {
                 url:'/dashboard',
                 title: 'Dashboard',
                 views : {
                    'pageContent': {
                        templateUrl:'views/dashboardView.html',
                        controller: 'dashboardCtrl'
                    }   
                 }             
              })
              .state('account.foo', {
                 url:'/foo',
                 title: 'foo',
                 views : {
                    'pageContent': {
                        templateUrl:'views/foo.html',
                        controller: 'fooCtrl'
                    }   
                 }             
              })
              .state('account.maps', {
                 url:'/maps',
                 title: 'Maps and stuff',
                 views : {
                    'pageContent': {
                        templateUrl:'views/mapsView.html',
                        controller: 'mapsCtrl'
                    }   
                 }             
              })

      }])