1
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>

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

7
  • какое значение вместо <?= $user['phone'] ?> приходит?
    – Grundy
    26 сен 2016 в 21:30
  • Вначале {{setPhone(phone, +7-(999)-999-99-99) | html}} (номер, правда, обычный, немного другой), а когда нажимаешься checkbox, меняется на <input type='text' id='phone' value='-1902'> 27 сен 2016 в 5:41
  • Добавил в кавычки, и номер начал выводиться. Но фильтр html не действует, не удается вывести html не в виде тега. 27 сен 2016 в 5:58
  • а что должен делать фильтр? 27 сен 2016 в 8:48
  • @AlexeyProkopenko, очевидно выводить html :)
    – Grundy
    27 сен 2016 в 8:48

1 ответ 1

0

Если вы хотите, что бы у вас строка выводилась как 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>

2
  • 1
    что должен демонстрировать данный пример?
    – Grundy
    27 сен 2016 в 8:55
  • Вот, все верно, спасибо! 27 сен 2016 в 10:46

Ваш ответ

By clicking “Отправить ответ”, you agree to our terms of service and acknowledge that you have read and understand our privacy policy and code of conduct.

Всё ещё ищете ответ? Посмотрите другие вопросы с метками или задайте свой вопрос.