Не отрабатывает фильтр html в Angular

212

10 декабря 2016, 10:09

angular.module("Angular", [])
.controller("AngularCtrl", function ($scope) {
$scope.setPhone = function(phone, user_phone) {
    return phone ? "<input type='text' id='phone' value='" + user_phone + "'>" : user_phone;
};
})
.filter('html', function($sce) {
return function(val) {
    return $sce.trustAsHtml(val);
};
});

Выше, собственно, код; ниже - html:

<div class="col-sm-3">
    {{setPhone(phone, '<?= $user['phone'] ?>') | html}}
</div>
<div class="col-sm-1">
    <div class="checkbox">
        <input type="checkbox" ng-model="phone">
    </div>
</div>

Не могу понять, почему не отрабатывает фильтр (как метод тоже не работает, если сделать альтернативный, с той же функцией).

Answer 1

Если вы хотите, что бы у вас строка выводилась как html, вам нужно использовать директиву ng-bind-html. Через фигурные скобки строка не будет рендериться.

angular.module("MyApp", []) 
  .controller("AngularCtrl", function($scope, $sce) { 
    $scope.setPhone = function(phone, user_phone) { 
      return $sce.trustAsHtml(phone ? "<input type='text' id='phone' value='" + user_phone + "'>" : user_phone); 
 
    }; 
    $scope.phone = true; 
  })

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.23/angular.min.js"></script> 
<div ng-app="MyApp"> 
  <div ng-controller="AngularCtrl"> 
    <div class="col-sm-3" ng-bind-html="setPhone(phone,'+7-(999)-999-99-99')"> 
    </div> 
    <div class="col-sm-1"> 
      <div class="checkbox"> 
        <input type="checkbox" ng-model="phone"> 
      </div> 
    </div> 
  </div> 
</div>

Создание интернет-магазина посуды в ABCname

ПОСЛЕДНИЕ ВОПРОСЫ

Все вопросы

ТОП-10

Все популярные вопросы

Выбор города реализация

Делаю сайт с мультивыбором городов, возник вопрос, как лучше хранить id текущего города? В базе данных или в куках? Какой способ наиболее правильный?...

204

PHP