我遇到了一个未找到元素的问题。我有来自ui-router的这个Ui-state叫做AuthDesc，而对于templateURL，我有这个：
<head>
<link rel="stylesheet" type="text/css" href="stylesheets/normalize.css" media="screen">
<link href='https://fonts.googleapis.com/css?family=Open+Sans:400,700' rel='stylesheet' type='text/css'>
</head>
<body>
<textarea id="SimpleMDE">
# This one autosaves!
By default, it saves every 10 seconds, but this can be changed. When this textarea is included
in a form, it will automatically forget the saved value when the form is submitted.
</textarea>
</body>
而对于Controller我有这个：
(function(angular) {
var app = angular.module('ForumApp');
app.controller('authDescCtrl', ["$scope", "$mdDialog", "$state", "$firebaseObject","refService","currentAuth",authDescCtrl])
function authDescCtrl($scope, $mdDialog, $state, $firebaseObject,refService,currentAuth){
$scope.topic = $firebaseObject(refService.ref().child("Topics"))
$scope.goToPerson = function(person, event) {
$mdDialog.show(
$mdDialog.alert()
.title('Navigating')
.textContent('Inspect ' + person)
.ariaLabel('Person inspect demo')
.ok('Neat!')
.targetEvent(event)
);
};
$scope.goToTopic = function(avatar, date, email, title, uid, username, value) {
$state.go("authHome.topic", {
"AVATAR": avatar,
"DATE": date,
"EMAIL": email,
"TITLE": title,
"UID": uid,
"USERNAME": username,
"VALUE": value
})
}
}
new SimpleMDE({
element: document.getElementById("SimpleMDE"),
spellChecker: true,
autosave: {
enabled: true,
unique_id: "SimpleMDE",
},
});
})(angular);
您可以在控制器的最后几行中看到有一个新的MDE Generator，但是控制台声明找不到该元素：
SimpleMDE：错误。没有找到任何元素。
我很迷惑。有一个名为textarea的SimpleMDE，但我不知道怎么没找到它。以下是野外代码的链接：https://ide.c9.io/amanuel2/fourm2
我担心Javascript会在HTML之前加载，因此它无法识别ID为SimpleMDE的texarea。
在window.onload event handler中包装小部件初始化对于角度控制器使用：
angular.element(document).ready(function () {
new SimpleMDE({
element: document.getElementById("SimpleMDE"),
spellChecker: true,
autosave: {
enabled: true,
unique_id: "SimpleMDE",
},
});
});
您也可以使用以下代码执行此操作：
$timeout(function() {
new SimpleMDE({
element: document.querySelector("#SimpleMDE"),
spellChecker: true,
autosave: {
enabled: true,
unique_id: "SimpleMDE",
}
});
});