Ember: если значение установлено в контроллере, выполните команду Ajax (записано в шаблоне), - PullRequest
Новая
       8

Ember: если значение установлено в контроллере, выполните команду Ajax (записано в шаблоне),

0 голосов
/ 06 ноября 2018

Я дал приблизительный код, чтобы понять, что мне нужно выполнить,

/ приложение / Route1 / controller.js 

export default Controller.extend({
    test: function(id) {
        $.ajax({
            .....
            .....
            .....
        }).then(() => {
           set('message','successfully added');
        });
    }
});

/ приложение / Route1 / template.hbs 

<div class="ui container">
  <div class="ui segment"
    <button class="ui button" {{action "test" model.id}}>Submit</button>
  </div>
</div>
<div class="ui container">
  <div class="ui modal">
    <div class="header"
      Message
    </div>
    <div class="content"
      {{message}}
    </div>
    <div class="actions">
      <div class="ui ok button">OK</button>
    </div>
  </div>
</div>
<script type="text/javascript">
  $.ajax({
    if(message) {
      $('.ui.modal').modal('show');   
    }
  })
</script>

Если я установлю сообщение в контроллере, тогда я должен показать это сообщение в MODAL. Команда Ajax, которую я написал, неверна. Пожалуйста, помогите решить эту проблему. Заранее спасибо

1 Ответ

0 голосов
/ 07 ноября 2018

Во-первых, вы не должны использовать <script> теги с тлеющим углем. Это не будет работать, как ожидалось, и никоим образом не поддерживается.

Если вам необходимо вручную получить доступ к DOM, вы должны использовать didInsertElement компонента.

Вы абсолютно уверены, что хотите создать свой модал самостоятельно? Есть множество аддонов, предоставляющих хороший API для модалов . Если вы можете использовать один из них. Если вы не можете, вы должны написать собственный компонент modal.

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

Теперь о вашей test функции. сначала вы пытаетесь использовать его как действие: 

{{action "test" model.id}}

однако для этого вы должны поместить функцию в хеш actions.

Следующая строка неверна: 

set('message','successfully added');

вы должны использовать this.set('message','successfully added'); или set(this, 'message','successfully added');

Тогда вы можете отобразить ваше сообщение так: 

{{#if message}}
  {{#modal-dialog
    onClose=(action (mut isShowingBasic) false)
  }}
    {{message}}
  {{/modal-dialog}}
{{/if}}

И все будет работать как положено.

...