не привязывается с помощью ng-if в угловых картах Google

Question

не привязывается с помощью ng-if в угловых картах Google

0

Итак, я прочитал, почему ng-non-bindable требуется для элемента <ui-gmap-windows> в Угловых Google Картах? и я получаю, как ng-non-bindable используется в директиве.

Моя проблема в том, что я пытаюсь использовать ng-if, чтобы условно выявить некоторые значки в моих указателях-окнах. ng-if не работает с ng-non-bindable, и, конечно, информационные окна не работают без него.

Если кто-то может сказать мне, как сделать ng-если работа в этой ситуации или дать альтернативное решение, я бы очень признателен.

      <ui-gmap-windows show="show">
            <div ng-non-bindable>{{obj.name}}<br>{{distance}} miles
            <span class="ion-man" ng-if="obj.men"></span>
          <span class="ion-woman" ng-if="obj.women"></span>
            <span class="ion-ios-people" ng-if="obj.people"></span>  
            </div>                     
          </div>
      </ui-gmap-windows>

mjabraham 29 окт. 2015, в 19:46

Источник

0

Вы можете просто обернуть это в другом div с помощью ng-if? Или обернуть содержимое div в span с помощью ng-non-bindable?
PSL 29 окт. 2015, в 18:53
0

Мне нужно, чтобы каждый был условным
mjabraham 29 окт. 2015, в 18:54
1

Хорошо. Я имел в виду <div ng-if="someCond"><span ng-non-bindable>{{obj.name}}<br>{{distance}} miles</span></div>
PSL 29 окт. 2015, в 18:57
0

да, это может сработать - мне придется сделать это несколько раз, чтобы удовлетворить каждое условие, которое кажется немного неловким, но что бы ни работало ... спасибо
mjabraham 29 окт. 2015, в 19:07

Показать ещё 2 комментария

Теги:

javascript

angularjs

google-maps

angularjs-directive

angular-google-maps

2 ответа

1

Причина, по которой это не работает, заключается в том, что ng-if (600) имеет более низкий приоритет, чем ng-non-bindable (1000), а ng-non-bindable - terminal:true поэтому ng-if никогда не компилируется из-за терминальной природы ng-non-bindable. Вы можете попробовать использовать ng-switch (1200) непосредственно в элементе с ng-non-bindable хотя, поскольку он имеет более высокий приоритет, но не уверен, что это применимо в вашем случае, если у вас может быть несколько условий, которые могут быть истинными.

Вы также можете создать свою собственную директиву, чтобы сказать, что моя-несвязуемая, и определите ее с конфигурацией, {priority:599, terminal:true} и используйте ее с ng-if say:

.directive('gmapTemplate', function() {
  return {
    priority: 599,
    terminal: true
  };
});

и использовать его с ng-if.

<div gmap-template ng-if="someCond">{{obj.name}}<br>{{distance}} miles

В противном случае вам придется обернуть не привязки в элементе с помощью ng-if

<div ng-if="someCond">
   <span ng-non-bindable>{{obj.name}}<br>{{distance}} miles</span>
</div>

angular.module('app', []).directive('gmapNonBindable', function() {
  return {
    priority: 599,
    terminal: true
  };
});

<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.0/angular.min.js"></script>
<div ng-app="app" ng-init="test:123; show:false">
  Show-->
  <input type="checkbox" ng-model="show" />
  <div gmap-Non-Bindable ng-if="show">{{test}}</div>


</div>

PSL 29 окт. 2015, в 17:51

Ещё вопросы

Вы можете просто обернуть это в другом div с помощью ng-if? Или обернуть содержимое div в span с помощью ng-non-bindable?
Мне нужно, чтобы каждый был условным
Хорошо. Я имел в виду <div ng-if="someCond"><span ng-non-bindable>{{obj.name}}<br>{{distance}} miles</span></div>
да, это может сработать - мне придется сделать это несколько раз, чтобы удовлетворить каждое условие, которое кажется немного неловким, но что бы ни работало ... спасибо

Gschoff · Accepted Answer · 2015-11-03T13-23-00.000Z

Вам нужно использовать атрибуты templateUrl и templateParameter в директиве ui-gmap-windows. TemplateUrl - это свойство объекта, который вы передаете, в котором находится строка, которая является путем к шаблону.html, который вы хотите использовать. ШаблонParameter является свойством объекта, который вы передаете, который является объектом, содержащим параметры, которые вы хотите передать. См. Код ниже. Также вы можете обратиться к документам здесь: http://angular-ui.github.io/angular-google-maps/#!/api/windows

<ui-gmap-windows  idKey="'name'" show="show" templateUrl="'pathToHtmltemplate.html'" templateParameter="'{name: 'name', distance: 1.3, womens_restroom: true}'">
</ui-gmap-windows>

Затем в вашем html-шаблоне вы можете использовать ng-if без проблем.

Обратите внимание, что вам нужно ссылаться на объект, который вы передаете в templateParameter в качестве параметра в шаблоне html, чтобы

Файл pathToHtmlTemplate.html будет выглядеть следующим образом:

<div>
    {{parameter.name}}<br>{{parameter.distance}} miles
    <span ng-if="parameter.womens_restroom" class="ion-woman"></span>
</div>