안녕하세요 내 앱에 중첩 된보기 양식을 만들었습니다. Angularjs 양식 문제. 양식이 보이지 않습니다.
그것은 그러나 나는 그것이 파셜에 저장 기능 (6 폼 페이지의 확장 형태에 더 많은 페이지를 추가하기로 결정 ... 큰 일/formname.html 등양식이 표시되지 않습니다. 그것은 단지입니다 빈 공간. 그냥 헤더/탐색 모음이 작동합니다.
나는 script.js에 문제가 있다고 생각합니다. 콘솔에서 오류가 발생하지 않는 것 같습니다. 하루 종일 이유를 알아 내려고 노력했습니다. 도망 가지 않고 정말로 도움이 될 수 있습니다. 감사합니다
여기 내 plunker입니다 : enter link description here
여기
<!DOCTYPE html>
<html ng-app="financeApp">
<head>
<link data-require="[email protected]" data-semver="3.1.1" rel="stylesheet" href="//netdna.bootstrapcdn.com/bootstrap/3.1.1/css/bootstrap.min.css" />
<script data-require="[email protected]*" data-semver="1.3.0-beta.5" src="https://code.angularjs.org/1.3.0-beta.5/angular.js"></script>
<script data-require="[email protected]" data-semver="0.2.10" src="https://rawgit.com/angular-ui/ui-router/0.2.10/release/angular-ui-router.js"></script>
<script data-require="[email protected]*" data-semver="2.1.1" src="//cdnjs.cloudflare.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script data-require="[email protected]*" data-semver="3.1.1" src="//netdna.bootstrapcdn.com/bootstrap/3.1.1/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="style.css" />
<script src="script.js"></script>
</head>
<body ng-controller = "demoCtrl">
<ul class="nav nav-pills pull-right">
<li ng-class="{active: isState('home') }">
<a ui-sref="home">Home</a>
</li>
<li ng-class="{active: isState('form') }">
<a ui-sref="form">Form</a>
</li>
<li ng-class="{active: isState('contact') }">
<a ui-sref="contact">Contact</a>
</li>
</ul>
<h3 class="text-muted">Demo Page</h3>
<br>
<div ui-view=""></div>
</body>
</html>
index.html을 그리고
var financeApp = angular.module('financeApp', [
'ui.router' ])
.config(['$urlRouterProvider', '$stateProvider',
function($urlRouterProvider, $stateProvider) {
$urlRouterProvider.otherwise('/home');
$stateProvider
.state('home', {
url: '/',
templateUrl: 'partials/home.html',
controller: 'homeCtrl'
})
.state('form', {
url: '/form',
templateUrl: 'partials/form.html',
controller: 'formCtrl'
})
//note the following are form's child states
.state('form.goal', {
url: '/goal',
templateUrl: 'partials/formGoal.html',
controller: 'formGoalCtrl'
})
.state('form.goalamount', {
url: '/goalamount',
templateUrl: 'partials/formGoalamount.html',
controller: 'formGoalamountCtrl'
})
.state('form.risk', {
url: '/risk',
templateUrl: 'partials/formRisk.html',
controller: 'formRiskCtrl'
})
.state('form.invest', {
url: '/invest',
templateUrl: 'partials/formInvest.html',
controller: 'formInvestCtrl'
})
.state('form.fund', {
url: '/fund',
templateUrl: 'partials/formFund.html',
controller: 'formFundCtrl'
})
.state('form.account', {
url: '/account',
templateUrl: 'partials/formAccount.html',
controller: 'formAccountCtrl'
})
//contact state
.state('contact', {
url: '/contact',
templateUrl: 'partials/contact.html',
controller: 'contactCtrl'
});
}
])
financeApp.controller('demoCtrl', ['$scope', '$state', '$location',
function($scope, $state, $location) {
$scope.isState = function(states) {
return $state.includes(states);
};
}
])
.controller('homeCtrl', ['$scope',
'$state',
function($scope, $state) {} ]) .controller('formCtrl', ['$scope',
'$state',
function($scope, $state) {
//This is to go to one of the child state of formCtrl. Here I choose
//it to go to profile state first.
//optionally you can use parent property or "abstract = true".
//or you can use $urlRedirect service.
$state.go('.profile');
}
]) .controller('formGoalCtrl', ['$scope', '$state',
function($scope, $state) {
//just a simple function to go to the next state using $state.go()
$scope.goToNextState = function(nextState){
$state.go(nextState);
}
}
]) .controller('formGoalamountCtrl', ['$scope', '$state',
function($scope, $state) {
$scope.goToNextState = function(nextState){
$state.go(nextState);
}
}
]) .controller('formRiskCtrl', ['$scope', '$state',
function($scope, $state) {
$scope.goToNextState = function(nextState){
$state.go(nextState);
}
}
]) .controller('formInvestCtrl', ['$scope', '$state',
function($scope, $state) {
$scope.goToNextState = function(nextState){
$state.go(nextState);
}
}
]) .controller('formFundCtrl', ['$scope', '$state',
function($scope, $state) {
$scope.goToNextState = function(nextState){
$state.go(nextState);
}
}
]) .controller('formAccountCtrl', ['$scope', '$state',
function($scope, $state) {
$scope.finished = function(){
alert('Form Completed!')
}
}
]) .controller('contactCtrl', ['$scope', '$state',
function($scope, $state) {
$scope.contact_str = "This is a string from contactctrl";
}
]);
당신이 콘솔에서 오류를 얻을 plunker에있는 탭을 클릭하면, 정의되지 않은 많은 기능 메시지도되지 않고있다 logged ... – SoluableNonagon
하지만 대부분의 오류는 angular.js CDN 코드에 있습니까?내 코드에 어떤 오류도 보이지 않습니까? – Superunknown