以下は、単純なベアボーンのアプリケーションです。 stateProviderではなくrouteProviderモジュールを使用しますが、同じ原則が適用されます。
私はlive Plunkerのデモをまとめました。 $ timeoutの使用方法の詳細については、hereをクリックしてください。
要部である:
app.controller('MainCtrl', function($scope, $timeout, $location) {
// Main controller
$scope.title = "First Page";
var goToSecondPage = function() {
$location.path('/second');
};
$timeout(goToSecondPage, 5000);
});
app.js
var app = angular.module('plunker', ['ngRoute']);
app.controller('MainCtrl', function($scope, $timeout, $location) {
// Main controller
$scope.title = "First Page";
var goToSecondPage = function() {
$location.path('/second');
};
$timeout(goToSecondPage, 5000);
});
app.controller('SecondCtrl', function($scope, $timeout, $location) {
// Second controller
$scope.title = "Second Page";
var goToMainPage = function() {
$location.path('/');
};
$timeout(goToMainPage, 5000);
});
app.config(['$routeProvider', function($routeProvider) {
$routeProvider
.when('/', {
templateUrl: "main.tpl.html",
controller: 'MainCtrl'
})
.when('/second', {
templateUrl: "second.tpl.html",
controller: 'SecondCtrl'
})
.otherwise({ redirectTo: '/' });
}]);
index.htmlを
<!DOCTYPE html>
<html ng-app="plunker">
<head>
<meta charset="utf-8" />
<title>AngularJS Plunker</title>
<script>document.write('<base href="' + document.location + '" />');</script>
<link rel="stylesheet" href="style.css" />
<script data-require="[email protected]" src="https://code.angularjs.org/1.4.9/angular.js" data-semver="1.4.9"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/angular.js/1.4.9/angular-route.js"></script>
<script src="app.js"></script>
</head>
<body>
<h1>My Angular App</h1>
<ng-view></ng-view>
</body>
</html>
main.tpl。HTML
<h2>{{title}}</h2>
<p>You will be redirected to the second page in 5 seconds...</p>
second.tpl.html
<h2>{{title}}</h2>
<p>This is the second page.</p>
<p>You will be redirected to the main page in 5 seconds...</p>
はい、私は設定したルートとコントローラを持っている...私は自分のコードにコードを統合しようとしたが、何をしていないようでした何か?これを行う別の方法がありますか?助けてくれてありがとうbtw – Freedom
コントローラのコードスニペットを投稿してください – Jake