Question

在这个指令中，我试图显示多个get请求的结果：

plnkr：https://plnkr.co/edit/BjETLN7rvQ1hNRIm51zG?p=preview src：

http-hello1.html : 
{ "content" : "divContent" , "id" : "r1" }
http-hello2.html : 
2. http-hello2.html
http-hello3.html : 
3. http-hello3.html

index.html : 

<!doctype html>
<html ng-app>
  <head>
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.6/angular.min.js"></script>
    <script src="script.js"></script>
  </head>
  <body>

  <div ng-controller="FetchCtrl">

  <source-viewer ng-repeat="sourceUrl in sourceUrls" url="sourceUrl"></source-viewer>
</div>


  </body>
</html>


mytemplate.html : 

<h1>{{url}}</h1>
<div>
    <p>{{model.address}}</p>
</div>

script.js : 

// Example of how to call AngularJS $http service and
var myapp = angular.module('app', []).controller('FetchCtrl', FetchCtrl)

myapp.directive('sourceViewer', function ($http) {
            return {
                restrict: 'E',
                templateUrl: 'mytemplate.html', 
                scope: {
                    url: '='
                }, 
                link: function (scope, elem, attrs, ctrl) {
                    $http.get(scope.url).success(function (data) {
                        $scope.model = data.data;
                    });
                }
            };
        });

function FetchCtrl($scope, $http, $q , $parse) {


$scope.sourceUrls = [
                'http-hello1.html',
                'http-hello2.html',
                'http-hello3.html'
            ];



}

但是没有任何东西被渲染出来。我是否正确定义了指令？

Answer 1

在ng-include

中使用mytemplate.html

https://plnkr.co/edit/gPoRn89anqn7uLRMYVSG?p=preview

自定义指令不呈现

1 个答案: