AngularJS ui.router chid Staaten nicht

Question

Laden

Ich habe versucht, dies für 3 Tage, um herauszufinden, ....

Ich habe ein Admin-Modul:

'use strict'; 

angular.module('aaBlogger.admin',['aaBlogger.admin.controllers']); 

angular.module('aaBlogger.admin').config(['$stateProvider', function($stateProvider){ 
     $stateProvider.state('admin',{ 
      url: '/admin', 
      abstract: true, 
      controller: 'AdminController', 
      templateUrl: 'modules/admin/views/admin.home.html' 
     }).state('admin.postNew',{ 
      url: '/post/new', 
      controller: 'PostCreationController', 
      templateUrl: 'modules/admin/views/admin.new.post.html' 
     }).state('admin.postUpdate',{ 
      url: '/post/:id/edit', 
      controller: 'PostUpdateController', 
      templateUrl: 'modules/admin/views/admin.update.post.html' 
     }).state('admin.postViewAll',{ 
      url: '', 
      controller: 'PostListController', 
      templateUrl: 'modules/admin/views/admin.all.posts.html' 
     }); 
    }] 
); 

Admin Startseite lädt in Index .html geht gut. Ich kann jedoch herausfinden, wie admin.postNew Zustand Vorlage in admin.home.html Vorlage

Admin Hause Vorlage

<div class="row"> 
    <div class="col-xs-3"> 
     <ul class="nav nav-pills nav-stacked on-click-make-active"> 
      <li><a ui-sref="admin.postViewAll">View All Posts</a></li> 
      <li class="active"><a ui-sref="admin.postNew">Add Post</a></li> 
     </ul> 
    </div> 
    <div class="col-xs-9 border-left"> 
     <div ui-view></div> 
    </div> 
</div> 

Nur für den Fall ist admin.postNew Vorlage

<div class="row" ng-controller="PostCreationController"> 
    <div class="col-xs-8"> 
     <form name="newPostForm" class="form-horizontal" novalidaterole='form'> 
      <div class="form-group" ng-class="{'has-error':postForm.title.$dirty && postForm.title.$invalid}"> 
       <label for="title" class="col-sm-2 control-label">Post Title</label> 
       <div class="col-sm-10"> 
        <input type="text" name="title" ng-model="post.title" ng-required="true" class="form-control" id="title" placeholder="Title"> 
        <span>Permalink:<i>/posts/[id]/{{post.title | permalink}}</i></span> <br/> 
        <span class="error-message" ng-show="postForm.title.$dirty && postForm.title.$invalid">Title is mandatory boss!</span> 
       </div> 
      </div> 
      <div class="form-group" ng-class="{'has-error':postForm.content.$dirty && postForm.content.$invalid}"> 
       <label for="content" class="col-sm-2 control-label">Content</label> 
       <div class="col-sm-10"> 
        <textarea cols="8" rows="6" name="content" class="form-control" ng-model="post.content" ng-required="true" id="content" placeholder="Content"></textarea> 
        <span>{{post.content | wordcount}} words</span> <br/> 
        <span class="error-message" ng-show="postForm.content.$dirty && postForm.content.$invalid">You need to have some content!</span> 
       </div> 
      </div> 
      <div class="form-group" ng-class="{'has-error':postForm.tags.$dirty && postForm.tags.$invalid}"> 
       <label for="tags" class="col-sm-2 control-label">Tags</label> 
       <div class="col-sm-10"> 
        <input type="text" name="tags" class="form-control" id="tags" ng-pattern="/^[\w,]+$/" ng-model="post.tags" placeholder="Comma separated tags"/> 
        <span class="error-message" ng-show="postForm.tags.$dirty && postForm.tags.$invalid">Sorry! No special characters allowed here.</span> 
       </div> 
      </div> 
      <div class="form-group" ng-class="{'has-error':postForm.keywords.$dirty && postForm.keywords.$invalid}"> 
       <label for="keywords" class="col-sm-2 control-label">Keywords</label> 
       <div class="col-sm-10"> 
        <input type="text" name="keywords" class="form-control" id="keywords" ng-pattern="/^[\w,]+$/" ng-model="post.keywords" placeholder="Comma separated keywords"/> 
        <span class="error-message" ng-show="postForm.keywords.$dirty && postForm.keywords.$invalid">Sorry! No special characters allowed here</span> 
       </div> 
      </div> 
      <div class="form-group"> 
       <div class="col-sm-offset-2 col-sm-10"> 
        <button type="submit" class="btn btn-success" ng-disabled="postForm.$invalid">{{buttonText}}</button> 
       </div> 
      </div> 
     </form> 
    </div> 
</div> 

Answer 1

hier laden Ich hatte ein ähnliches Problem. seine Lösung

admin.home.html müssen Tag haben <div ui-view="content"></div>

angular.module('aaBlogger.admin').config(['$stateProvider', function($stateProvider){ 
    $stateProvider.state('admin',{ 
     url: '/admin', 
     abstract: true, 
     templateUrl: '<div ui-view=""></div>' 
    }) 
    .state('admin.postNew',{ 
     url: '/post/new', 
     views: { 
      '': { 
       templateUrl: 'modules/admin/views/admin.home.html', 
       controller: 'AdminController' 
      }, 
      'content@admin.postNew': { 
       templateUrl: 'modules/admin/views/admin.new.post.html', 
       controller: 'PostCreationController' 
      } 
     } 
    }) 
}] 

);