让一个RequireJS和AngularJS应用程序行为不正常，控制器被调用两次销毁特定细节的数据。尝试删除控制器中的init（）但是在执行刷新之前数据不会加载。任何帮助都会有所帮助。代码如下：
Index.html文件
<head>
<script src="../Scripts/angular.js"></script>
<script data-main="main.js" src="../Scripts/require.js"></script>
</head>
<body>
<div data-ng-cloak>
<div data-ng-view ></div>
</div>
</body>
</html>
main.js文件
require.config({
paths: {
// define alias for the directories
'mod': '_modules'
}
});
require([
// these are the java script files without the .js at the end
// that I want to be global accessable
"mod/appMod"
,"/App/NorthernStars/Ctrl/northCtrl.js"
],
function () {
angular.bootstrap(document, ['g2vStars']); // kick off AngularJS and the name of the app
}
);
appMod.js
var dependencies = ['mod/northMod'];
define(dependencies, function () {
'use strict';
var g2vStar = angular.module("g2vStars", ['northStars']);
return g2vStar;
});
northMod.js
var dependencies = ['../../Scripts/angular-route.js']
define( dependencies,
function () {
'use strict';
var northStars = angular.module('northStars', ['ngRoute']);
northStars.config(['$routeProvider',
function ($routeProvider) {
$routeProvider
.when('/', {
controller: 'nsCtrl',
templateUrl: '/App/NorthernStars/Views/northStarView.html'
})
.when('/northList', {
controller: 'nsCtrl',
templateUrl: '/App/NorthernStars/Views/northStarView.html'
})
.when('/searchNorth', {
controller: 'nssCtrl',
templateUrl: '/App/NorthernSearch/Views/northSearchView.html'
})
.otherwise({ redirectTo: '/' });
}
]);
return northStars;
});
northCtrl.js
var dependencies = ['../../_modules/northMod.js','../Services/northFactory.js'];
define(dependencies, function (g2v, factory) {
'use strict';
var nsCtrl = function ($scope, nsFactory) {
$scope.headerMessage = "List of Northern Stars classified as G2V Stars. ";
$scope.dataObjects = [];
$scope.dataDetail = {};
$scope.crap = true;
//Called from the northStarView.html`enter code here`
$scope.getDetail = function (index) {
var id = $scope.dataObjects[index].g2v_ID;
$scope.dataDetail = nsFactory.getObject(index);
$scope.crap = false;
//After this the entire controller runs again
};
function init() {
$scope.dataObjects = nsFactory.getObjects();
};
//If I dont have this the data is not loaded until a refresh
init();
};
g2v.controller("nsCtrl", ['$scope', 'nsFactory', nsCtrl]);
});
northFactory.js
var dependencies = ["../../_modules/appMod.js"];
define(dependencies, function (g2v) {
'use strict';
var nsFactory = function () {
var factory = {};
var dataItems = [];
var data = [{ "g2v_ID": "c516634e-e8a1-4872-bbd3-deacf6387770", "HIP": 36921, "SAO": 33726, "RA": "12:10", "DEC": "20:46", "Magitude": 5, "StarType": "Yellow", "SearchFor": 16 },
{ "g2v_ID": "7488d47b-c102-4984-bc9f-6c5a68b72c8b", "HIP": 39193, "SAO": 17224, "RA": "14:12", "DEC": "8:08", "Magitude": 13, "StarType": "Fuscia", "SearchFor": 19 },
{ "g2v_ID": "7dae1f2f-d3dc-42d6-a69a-9b18333d556f", "HIP": 47480, "SAO": 38030, "RA": "20:05", "DEC": "20:37", "Magitude": 7, "StarType": "Indigo", "SearchFor": 17 },
{ "g2v_ID": "08f4bd26-ef7f-44d9-ac1b-c60df3bfb724", "HIP": 12119, "SAO": 31825, "RA": "16:10", "DEC": "21:05", "Magitude": 6, "StarType": "Teal", "SearchFor": 8 }
];
factory.getObjects = function () {
return data;
};
factory.getObject = function (id) {
return data[id];
};
return factory;
};
g2v.factory("nsFactory", [nsFactory]);
});
northStarView.html
<div style="top: 1px; height: 50px; background-color: #FBFBEF; border: #F2F5A9 groove; ">
{{headerMessage}}
</div>
<div style="margin-left:5px; overflow-y:auto; height:95%;">
<table class="padded-table alter-row" border="1" style="background-color: #A4A4A4; border: #f2f5a9 groove; ">
<thead class=" control-label">
<tr>
<td style="width:100px; text-align: center; display:none;">ID</td>
<td style="width:100px; text-align: center;">HIP</td>
<td style="width: 100px; text-align: center;">SAO</td>
<td style="width: 100px; text-align: center;">RA</td>
<td style="width: 100px; text-align: center;">DEC</td>
<td>Magitude</td>
<td>Star Type</td>
<td>Option</td>
</tr>
</thead>
<tbody>
<tr ng-repeat="dataItem in dataObjects">
<td style="display:none">{{dataItem.g2v_ID}}</td>
<td style="text-align:right; padding-right: 5px;">{{dataItem.HIP}}</td>
<td style="text-align:right; padding-right: 5px;">{{dataItem.SAO}}</td>
<td style="text-align:right; padding-right: 5px;">{{dataItem.RA}}</td>
<td style="text-align:right; padding-right: 5px;">{{dataItem.DEC}}</td>
<td style="text-align:right; padding-right: 5px;">{{dataItem.Magitude}}</td>
<td style="text-align:right; padding-right: 5px;">{{dataItem.StarType}}</td>
<td style="text-align: center;"><a href="#" data-ng-click="getDetail($index)">Details</a></td>
</tr>
</tbody>
</table>
<table class="padded-table alter-row" border="1" style="background-color: #A4A4A4; border: #f2f5a9 groove; ">
<thead class=" control-label">
<tr>
<td style="width:100px; text-align: center; display:none;">ID</td>
<td style="width:100px; text-align: center;">HIP</td>
<td style="width: 100px; text-align: center;">SAO</td>
<td style="width: 100px; text-align: center;">RA</td>
<td style="width: 100px; text-align: center;">DEC</td>
<td>Magitude</td>
<td>Star Type</td>
</tr>
</thead>
<tbody>
<tr>
<td style="display:none">{{dataItem.g2v_ID}}</td>
<td style="text-align:right; padding-right: 5px;">{{dataDetail.HIP}}</td>
<td style="text-align:right; padding-right: 5px;">{{dataDetail.SAO}}</td>
<td style="text-align:right; padding-right: 5px;">{{dataDetail.RA}}</td>
<td style="text-align:right; padding-right: 5px;">{{dataDetail.DEC}}</td>
<td style="text-align:right; padding-right: 5px;">{{dataDetail.Magitude}}</td>
<td style="text-align:right; padding-right: 5px;">{{dataDetail.StarType}}</td>
</tr>
</tbody>
</table>
</div>
问题是当点击data-ng-click =“getDetail（$ index）”并且控制器中的$ scope.getDetail运行时整个控制器重新初始化并且我丢失了我的详细信息。
我做错了什么？
肯
答案 0 :(得分：0)
而不仅仅是这个：
angular.bootstrap(document, ['g2vStars']);
使用此：
angular.element(document).ready(function () {
angular.bootstrap(document, ['g2vStars']);
});
你必须等待（文件准备就绪......）来引导角度应用程序。