Dynami c значок в виде результата - PullRequest
2 голосов
/ 15 февраля 2020

Я изменил ручку, чтобы добавить значок в виде результата. это работает, когда страница загружается, но когда вы добавляете динамически, нет. вот ручка: https://codepen.io/nathel/pen/eYNZYJN любая помощь будет оценена

    <div class="panel">
        <input type="text" placeholder="Search Bookmarks" ng-model="search" />       
    </div>      
    <ul class="bookmarks">
        <li ng-repeat="site in bookmarks | filter: search">
          <a href="{{ site.url }}">
            <img ng-src="{{site.favicon}}">{{site.url}}
          </a>
          <span class="label secondary"> {{site.category}}</span>
          <i class="right icon-trash" ng-click="deleteBookmark($index)"></i> 
        </li>
    </ul>    
</div>    
var myApp = angular.module("myApp", ["favicon"]);
myApp.controller("appCtrl", ["$scope", "faviconFilter", function($scope, faviconFilter) {
  $scope.bookmarks = [
    {
      //title: 'CodePen',
      url: 'https://codepen.io',
      category: 'Web Design',
      likes: 3
    }
  ];
  $scope.increment = function ($index) {
      $scope.likes++;
   };
  $scope.addBookmark = function () {
      $scope.bookmarks.push({
          title: $scope.site_name,
          url: $scope.site_url,
          category: $scope.site_category,
          likes: 0
      });
      $scope.site_name = '';
      $scope.site_url = '';
      $scope.site_category = '';
  };
  $scope.bookmarks.forEach( function(bookmarks) {
    bookmarks.favicon = faviconFilter(bookmarks.url);
  });

  $scope.deleteBookmark = function (id) {
      var bookmark = $scope.bookmarks[id];
      $scope.bookmarks.splice(id, 1);
  };
}]);    

1 Ответ

0 голосов
/ 15 февраля 2020

это работает, когда страница загружается, но когда вы добавляете динамически, нет.

Добавьте свойство favicon к выдвигаемому объекту в функции addBookmark:

 $scope.addBookmark = function () {
      $scope.bookmarks.push({
          title: $scope.site_name,
          url: $scope.site_url,
          category: $scope.site_category,
          likes: 0,
          //IMPORTANT
          favicon: faviconFilter($scope.site_url)
      });
      $scope.site_name = '';
      $scope.site_url = '';
      $scope.site_category = '';
  };
...