私はangularjsが初めてです。私のプロジェクトでは、http 応答として HTML ファイルを取得しています。ng-bind-html は html コードで動作します。しかし、html 内の angularjs コードはコンパイルされていません。$compile で解決策を試しましたが、何も機能しません。これに対する良い解決策を提案してください。
次のようなサンプル コードがあるとします。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>TEST</title>
<script src="angular.js"></script>
</head>
<body ng-app="myapp">
<div ng-controller="myController">
<p compile="htmlresponse"></p>
</div>
<script>
var app = angular.module('myapp', []);
app.controller('myController', function ($rootScope,$sce) {
$http.get(,,,,).success(function(data){
$rootScope.htmlResponse=$sce.trustAsHtml(data);
}
});
app.directive('compile', function($compile) {
// directive factory creates a link function
return function(scope, element, attrs) {
scope.$watch(
function(scope) {
return scope.$eval(attrs.compile);
},
function(htmlResponse) {
element.html(htmlResponse);
$compile(element.contents())(scope);
}
);
};
});
</script>
</body>
</html>
応答として HTML のみを取得した場合、これは正常に機能します。angularjs（app.module、app.controller、app.directivesを含む）でHTMLを取得すると、html部分のみがコンパイルされます。この問題で私を助けてください。
これが私の応答例です。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>TEST</title>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.1/angular.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.3.1/angular-animate.min.js"></script>
</head>
<body ng-app="myapp">
<div ng-controller="myController">
{{name.myname}}
</div>
<script>
var app = angular.module('myapp', []);
app.controller('myController', function ($scope) {
$scope.name={};
$scope.name.myname = "stack";
});
</script>
</body>
</html>