중첩된 경로 angularjs를 사용할 때 "상태에서...를 해결할 수 없습니다" 오류가 표시됨

중첩된 경로 angularjs를 사용할 때 "상태에서...를 해결할 수 없습니다" 오류가 표시됨

angularjs는 처음이라 응용 프로그램에 중첩된 ui-routes를 사용하고 싶습니다.일부 코드 조각...

profile.disply

<div class="row">
<div class="dl-horizontal" id="information">

    <div class="col-md-8 col-md-offset-2">

    <!-- edit button -->
    <div style="margin-bottom: 15px">   
        <div class="button" style="margin-top:5px" style="float:left">
            <button type="button" class="btn btn-primary" ui-sref="edit_profile" ng-click="populate()"><span class="glyphicon glyphicon-pencil"></span> Edit Profile</button>
        </div>
    </div>

클라이언트_UI.js

//object for routing
var route = angular.module('route', ["ui.router"])

// configure the routing        
route.config(function($stateProvider, $urlRouterProvider, $locationProvider) {

    // send to profile page
    $urlRouterProvider.otherwise("/profile");

    $stateProvider

    // route for personal info
    .state('profile', {
        url: "/profile", 
        templateUrl : "profile_area/profile.html" , 
        controller : 'profileController'
    })

편집하다

<script src="Scripts/angular-ui-bootstrap.js"></script>


    <!-- title -->
    <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal">&times;</button>
        <h2 class="modal-title"> Editing Profile</h2>
    </div>

    <div class="modal-body">
        <form role="form" id="myForm">

            <!-- Name -->
        <div class="panel panel-default">
        <div class="panel-body">
            <div class="form-group">
                <label for="name">Name &nbsp;</label>
                <input placeholder="{{infos.Name}}" id="name" type="text" ng-model="name">
            </div>

profile.disply

//object for routing
var route = angular.module('route', ["ui.router"])

// configure the routing        
route.config(function($stateProvider, $urlRouterProvider, $locationProvider) {

$stateProvider

//route for edit page
.state('edit_profile', {
    url: "/edit_profile",
    templateURL : "edit/edit_profile.html" ,
    controller : 'editController'
})
});

route.controller('editController' ["$scope", "$resource", function($scope, $resource) {

// resource objects
var profile = $resource($scope.apicall + "/api/userprofile/", {Userid:$scope.userid}, {'post':{method: 'POST'}});
var edit = new profile();

이것은 뷰(index.display)입니다.

       <!-- route veiw -->
    <div class="container" id="route" style="width:90%">
            <div ui-view></div>
    </div>

    <!-- Footer -->
    <footer></footer>

콘솔에서 "Profile" 상태에서 "edit_profile"을 확인할 수 없습니다.edit.html은 profile.html의 하위 상태로 간주됩니다.angularjs에서 ui-routing을 사용하고 있습니다.profile.html의 버튼을 클릭하면 상태가 edit_profile로 변경되어 index.html의 ui 뷰에 표시됩니다.이 문제를 해결하는 방법에 대한 제안이나 다른 쉬운 방법이 있습니까?

이 경우 angular는 상태를 찾을 수 없다는 것을 알려 줍니다.여기서 작업 예를 작성했습니다.

그 이유는 실제로 2개의 js 파일을 로드해야 하기 때문입니다.

• profile.disply
• 클라이언트_UI.js

둘 다 로딩해야 하는데 둘 다 같은 모듈을 선언할 수 없습니다.

var route = angular.module('route', ["ui.router"])

다음 중 하나가 다르거나 선언하지 않고 모듈을 소비해야 합니다.

// client_UI.js
var route = angular.module('client_ui', ["ui.router"])
// profile.js
var route = angular.module('route', ["ui.router", "client_ui"])

또는 둘 다 같은 모듈에 있을 수 있습니다.

// client_UI.js
var route = angular.module('route', ["ui.router"])
// profile.js
var route = angular.module('route')

여기서 모두 동작하고 있는지 확인합니다.

언급URL : https://stackoverflow.com/questions/24895163/getting-could-not-resolve-from-state-error-when-using-nested-routes-an