привязка в шаблоне директивы, когда директива вызывает тег из фабричной функции - PullRequest
Новая
       11

привязка в шаблоне директивы, когда директива вызывает тег из фабричной функции

0 голосов
/ 27 сентября 2018

Я пытаюсь вызвать фабричную функцию с помощью такой директивы: 

var app = angular.module('plunker', []);

app.controller('Ctrl', function($scope, peopleFactory) {

  $scope.people = ['john', 'sam', 'roy'];

  $scope.test = function(name) {
    var person = peopleFactory.person(name);
    return person;
  }
});

app.factory('peopleFactory', function() {
  var factory = {};

  factory.person = function(name) {
    var people = {
      john: {
        firstName: "John",
        lastName: "Smith",
        id: 123,
        tag: "<div id='{{person.id}}'>{{person.firstName}} is a doctor and his id is {{person.id}}</div>" +
          "<h1>{{person.lastName}}</h1>"
      },
      sam: {
        firstName: "Sam",
        lastName: "Cole",
        id: 456,
        tag: "<div>{{person.firstName}} has a different text</div>" +
          "<h1>{{person.lastName}}</h1>"
      },
      roy: {
        firstName: "Will",
        lastName: "Kan",
        id: 789,
        tag: "<h4>Some text about this person named {{person.firstName}} {{person.lastName}}</h4>"
      }
    };

    return people[name];
  };


  return factory;
})
app.directive('changeIt', function($compile) {
  return {
    restrict: 'CA',
    scope: {
      getDataFn: '&'
    },
    template: '{{getDataFn().tag}}'
  }
});
<html ng-app="plunker">

<head>
  <meta charset="utf-8" />
  <title>AngularJS Plunker</title>
  <link rel="stylesheet" href="style.css" />
  <script data-require="angular.js@1.0.x" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.7/angular.js" data-semver="1.0.7"></script>
  <script src="app.js"></script>
</head>

<body ng-controller="Ctrl">
  <ul>
    <li data-ng-repeat="person in people">
      <div class="change-it" get-data-fn="test(person)"></div>
    </li>
  </ul>
</body>

</html>

Я знаю, что там чего-то не хватает, поэтому я не могу связать person.firstName и так далее в ключе тега.Может ли кто-нибудь указать мне правильное направление, как я могу это исправить?Вот плункер:

http://plnkr.co/edit/dQknKe0wRRgTGnPYQ3Ta?p=preview

...