2016-07-05 6 views
2

Ajaxを使用して取得しているコンテンツがあります。これはjsonオブジェクトです。そのオブジェクトはブラウザに表示されますRx.Observable.fromEventをajaxコンテンツに追加する方法

var stateSubjectSub = stateSubject.subscribe(function(data) { 
console.log('state changes'); 
console.log(data); 

var list = document.querySelector('#state .mdl-list'); 
if (list) { 
    document.getElementById('state').removeChild(list); 
} 

if (data.objectives && data.objectives.length > 0) { 
    document.getElementById('state').appendChild(h('ul.mdl-list', 
     data.objectives.map(function(item) { 
      return h('li.mdl-list__item.mdl-list__item-three-line', { 
        'data-type': 'objective' 
       }, 
       h('span.mdl-list__item-primary-content', 
        h('span',item.title) 
       ), 
       h('span.mdl-list__item-text-body', 'some stuff goes here'), 
       h('span.mdl-list__item-secondary-content', 
        h('a.mdl-list__item-secondary-action', { 
         href: '#' 
        }, h('i.material-icons.mdl-badge.mdl-badge--overlap', { 
         'data-badge': item.initiatives ? item.initiatives.length : 0 
        }, 'assistant_photo')) 
       ) 
      ); 
     }) 
    )); 
} 
state = data; 

}, function(err) { 
    console.log(err); 
}); 

Ajaxがロードされ、状態が更新され、DOMがビルドされています。すべてが期待どおりに動作しています。私の質問は、どのように私はdocument.readyに存在しない何かに加入者を追加するのですか?私は、将来登場するものにオブザーバーを結びつける必要があります。 RxJSを使ってどうすればいいですか?あなたはObservableを作成することができますちょうど

+0

「ul-> li-> a」要素で観察したいことはありますか? – demarchisd

+0

アンカーをクリックしたとき –

+0

要素が存在するのは、document.readyに存在しない場合ですか?その創造を引き起こすのは何ですか? – paulpdaniels

答えて

1

をRxJS>要素

私はjQueryのを使用するか、またはそのようなものではないと私はに固執したいのですが - 具体的に、私は、ULに、観察を追加したい - >李Observable.fromEvent

/** Build DOM elements like ul -> li -> a **/ 

var anchor = //the anchor element that you're creating dynamically 

var source = Rx.Observable.fromEvent(anchor, 'click'); 

var subscription = source.subscribe(
    function (x) { 
     console.log('Next: Clicked!'); 
    }, 
    function (err) { 
     console.log('Error: ' + err); 
    }, 
    function() { 
     console.log('Completed'); 
    }); 
+0

これを試しましたが、nullにeventListenerを追加できないというエラーが表示されました。その時点でアンカーが存在しないので、ヌル –

+0

'/ ** ul - > li - > a ** /'のようなDOM要素をビルドするのではなく、アンカーの作成を含むコード全体を投稿できますか? – demarchisd

+0

すべてのコードを追加しました –

関連する問題