私はaurelia-dialog
プロジェクト(ほとんどrendererに焦点を当てています)を見てきました。私はtoastr projectが好きですが、Aurelia CLIで動作するようには思えません(ただし、Typescriptスケルトンプロジェクトで動作させることはできます)。私は独立したソリューションを開発し始めましたが(jQueryとは独立していますが)、なぜ動作しないのか分かりません。Aureliaを使用してDomに動的に追加
au new
コマンドを使用して新しいプロジェクトを作成しました。 私はこれを含むようにapp.ts
ファイルを更新:
import {Toastr} from './toastr';
export class App {
constructor() {
new Toastr().showToast();
}
}
と私はapp.ts
ファイルと同じレベルで一つの他のファイルtoastr.ts
を追加しました。この内容は、このされています:
import {DOM} from 'aurelia-pal';
export class Toastr {
showToast() {
let body = DOM.querySelectorAll('body')[0];
let toastrContainer = DOM.getElementById('toastr-container');
if(!toastrContainer) {
toastrContainer = DOM.createElement('div');
toastrContainer.id = 'toastr-container';
toastrContainer.textContent = 'boo';
body.insertBefore(toastrContainer, body.firstChild);
}
}
}
コードが正常に動作し、私はshowToast
メソッド内でそれを配置する場合、ブレークポイントにヒットするが、私は、ブラウザでのDOMを検査するとき、div要素を追加していないようですhtmlで
私は間違っていますか?この要素を実際にDOMに挿入するにはどうすればよいですか? htmlを再描画するために呼び出す必要がある別のメソッドがありますか?私はaurelia-dialog
プロジェクトでそれ以外の何かを見たことがありませんでした。