DOJOアプリケーションの角度

Angularを使用して既存のDOJOアプリケーションの一部を記述する必要があります。私は、プランブhttp://plnkr.co/edit/8pgdNwxFoxrDAQaQ4qfm?p=previewを作成しました。これは角度モジュールをロードしていません。私は間違って何をしていますか？DOJOアプリケーションの角度

このplunkrは、角度コントローラからhello Worldを表示する必要があります。

<div data-dojo-type="dijit/layout/ContentPane" 
      data-dojo-props='isLayoutContainer: "true"' 
      title="Testing Angular with DOJO" 
      id="targetID" 
      selected="false"    
      href="page.html">

私は角のモジュールをロードして、コントローラからの変数を使用しようとpage.htmlが含まれるように同じメカニズムを踏襲し、そこに同じページに我々のアプリケーションでDOJOを使用する他のdivがありますので。

<body ng-app="myApp"> 
    <div ng-controller="myAppController as myAppCtrl"> 
    angular content here... {{ myAppCtrl.hello }} 
    </div> 
</body>

表示するシンプルな角度モジュールとコントローラは、Hello Worldの

(function() { 
    'use strict'; 

console.log("inside myApp js"); 

angular.module('myApp', []) 

     .run([function() { 
      console.log("inside angular module"); 
     }]) 

     .controller('myAppController', [function() { 
      var self = this; 
      self.hello = "Hello World!" 
      console.log("inside angular controller"); 
     }]) 
})();

出典

2016-04-12 would_like_to_be_anon

あなたはDijitsに（あなたのHTMLマークアップで）特別に装飾されたノードを変換するためにdojo/parserを使用する必要があります。

次のコードでは、parser.parse()を呼び出すとその使用方法がわかります。

dijit/registryを使用して、ウィジェットの初期化を確認してください。

質問コードには、モジュールContentPaneで定義されていないプロパティがいくつか含まれているため、以下のコードでそれらを削除しました。

ContentPaneの方法とプロパティについては、APIを参照してください。

以下の動作例では、Dojoで使用できる2つのウィジェットが表示されているコンソールを見てください。あなたの実際のアプリケーションで

https://jsbin.com/joyuhesapo/edit?html,console,output

あなたはdojo/parseで（私はあなたが、角度でそれを作成していると信じて）HTMLマークアップを解析する必要があります。

<!DOCTYPE html> 
<html> 

<head> 
    <link rel="stylesheet" href="https://ajax.googleapis.com/ajax/libs/dojo/1.6/dijit/themes/claro/claro.css" /> 
    <script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.5/angular.min.js"></script> 
    <script data-dojo-config="async: true" src="//ajax.googleapis.com/ajax/libs/dojo/1.10.4/dojo/dojo.js"></script> 
    <script> 
     require([ 
      "dojo/parser", 
      "dijit/layout/ContentPane", 
      "dijit/form/Button", 
      "dijit/registry", 
      "dojo/domReady!"], function (
      parser, 
      ContentPane, 
      Button, 
      registry 
      ) { 
       parser.parse().then(function() { 
        var widgets = registry.toArray(); 
        widgets.forEach(function(widget){ 
         console.log(widget.id); 
        }); 
       }); 


      }); 

    </script> 

</head> 

<body> 
    <h1>Hello Angular + DOJO!</h1> 
    <button data-dojo-type="dijit/form/Button" type="button"> Just an example Click! </button> 
    <div data-dojo-type="dijit/layout/ContentPane" data-dojo-props="title: 'Testing Angular with DOJO', isLayoutContainerIndicates : true"> 
     Panel Content 
    </div> 
</body> 

</html>

出典

2016-04-13 07:20:57 GibboK

パーサーなしでやってみたところ、うまく動作しているようです。 http://plnkr.co/edit/hOLYbqzG6KP6nIEfyPd1?p=previewこのコードにパーサーを組み込むにはどうしたらいいですか？dijitに変換するのはどのような違いがありますか？ –

宣言的アプローチを使用する場合、パーサーを使用しない場合のように、ウィジェットインスタンスを開始することはできません。次の例のように、dojo/parserモジュールを使用してパーサーを組み込むことができます。パーサを使用しない場合は、dojoでウィジェットを作成することができないため、代わりにプログラムによる承認を使用する必要があります。http://plnkr.co/edit/vTd5WcVtSG4yS6xUFHOU?p=preview – GibboK

便利な情報https：// dojotoolkit。 org/documentation/tutorials/1.10/declarative / – GibboK

DOJOアプリケーションの角度

答えて

関連する問題