Question

我有一个带有Onsen UI 1.3.6的单页Angular应用程序。

我正在尝试显示一个对话框，但我一直收到404 Not Found错误。

我的Javascript是：

ons.createDialog('iconselector.html').then(function(dlg) {
  dlg.show();
});

我的HTML是：

<ons-template id="iconselector.html" cancelable>
  <ons-dialog>
    <p>Hello world1</p>
  </ons-dialog>
</ons-template>

我收到错误声明：

获取http://localhost/yourdomain/templates/iconselector.html 404（不是 Found）startSymbol @ loader.js：1433sendReq @ loader.js：1432 $ get.serverRequest @ loader.js：1432processQueue @ loader.js：1433（匿名函数）@ loader.js：1433 $ get.Scope。$ eval @ loader.js：1435 $ get.Scope。$ digest @ loader.js：1435（匿名函数） @ loader.js：1435completeOutstandingRequest @ loader.js：1430（匿名函数）@ loader.js：1430

但是，如果我尝试使用Tab栏的loadPage（＆＃39; somepage.html＆＃39;）方法将任何模板显示为普通页面，则模板将按预期工作。

Answer 1

可能您在创建iconselector.html页面之前尝试创建对话框，这就是它无法找到页面的原因。修复ons.ready()函数，该函数在初始化所有DOM之后执行代码。这是一个例子：

ons.ready(function() {   
  ons.createDialog('iconselector.html').then(function(dialog) {
    dialog.show();
  });
});

HTML中也存在两个错误：

cancelable是ons-dialog而非ons-template

var="dlg"

ons-dialog

这是固定代码：

<ons-template id="iconselector.html">
  <ons-dialog var="dlg" cancelable>
    <p>Hello world1</p>
  </ons-dialog>        
</ons-template>

希望它有所帮助！

在Onsen UI中基于模板显示对话框的正确方法是什么？

1 个答案: