1
我想使用routeProvider ng-view和3個控制器製作三個選項卡應用程序。我製作了一個主要的HTML頁面和3個選項卡HTML頁面。切換選項卡工作正常,我可以訪問選項卡內的變量;但是,我不能訪問控制器內聲明的函數。哪裏有問題?在控制器內的ng-click功能不起作用
<!doctype html>
<html ng-app="project">
<head>
<meta charset="utf-8">
<title>Tabs</title>
<link rel="stylesheet" href="http://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" />
<link href="css/bootstrap.min.css" rel="stylesheet" media="screen">
<link href="css/bootstrap-responsive.css" rel="stylesheet">
<link href="css/app.css" rel="stylesheet">
<script src="js/jquery.js"></script>
<script src="js/bootstrap.min.js"></script>
<script src="lib/angular/angular.js"></script>
<script src="js/tbb.js"></script>
</head><body>
<div class="tabtable">
<ul class="nav nav-tabs">
<li class="active">
<a href="#/tab1" data-toggle="tab">Tab1</a>
</li>
<li>
<a href="#/tab2" data-toggle="tab">Tab2</a>
</li>
<li>
<a href="#/tab3" data-toggle="tab">Tab3</a>
</li>
</ul>
<div class="tab-content">
<div class="tab-content">
<!--tabs content-->
<div ng-view>
</div>
</div>
</div>
</div>
這是JavaScript代碼:
angular.module('project',[]).
config(function($routeProvider) {
$routeProvider.
when('/', {controller:Ctrl1, templateUrl:'tbb_1.html'}).
when('/tab1', {controller:Ctrl1, templateUrl:'tbb_1.html'}).
when('/tab2', {controller:Ctrl2, templateUrl:'tbb_2.html'}).
when('/tab3', {controller:Ctrl3, templateUrl:'tbb_3.html'}).
otherwise({redirectTo:'/'});
})
.run(function($rootScope, $location) {
$rootScope.var1=1;
//alert($rootScope.var1);
// register listener to watch route changes
$rootScope.$on("$routeChangeStart", function(event, next, current) {
//alert('change');
});
});
function Ctrl1($scope,$rootScope) {
$scope.var2=$rootScope.var1;
function dodo1(){
alert('23');
}
$rootScope.$on('$routeChangeStart', function(event, next, current) {
//alert('change inside ctrl');
//alert(form.supervisor.$dirty);
});
}
function Ctrl2($scope,$rootScope) {
}
function Ctrl3($scope,$rootScope) {
}
tbb_1.html
<h2>tab1</h2>
{{2+2}}<br>
|{{var1}}|<br>
|{{form.var1.$dirty}}|
<a href="" ng-click="var1=8;">property</a>
<a href="" ng-click="dodo1();">dodo</a>
<button class="btn btn-mini" ng-click="dodo1()">buu</button>
<form class="form-horizontal" novalidate name="form" ng-submit="submit()">
<fieldset>
<input id="var1" name="var1" placeholder="" class="input"
type="text" ng-model="var1">
</fieldset>
</form>
爲什麼點擊渡渡鳥和按鈕奈何?