cyclejsが事があるマップ操作中に入力されたテキストから

Question

Main.ts 

    const clickMessages$ = sources.DOM 
      .select('.add') 
      .events('click'); 

     const latitudeMinimum$ = sources.DOM 
      .select('.latitudeMinimum') 
      .events('input'); 

     const latitudeMaximum$ = sources.DOM 
      .select('.latitudeMaximum') 
      .events('input'); 


     const latituteRange$ = xs.combine(latitudeMinimum$, latitudeMaximum$); 

     const newStream$ = xs.combine(clickMessages$, latituteRange$); 
     const filter$ = newStream$.filter(c => { return true }); 
     const map$ = filter$.map(([a, [b, c]]) => { return [b.target.value, c.target.value] } 
// <<--- b.target.value won't compile... was expecting to get my value from input field 

Answer 1

をターゲットを抽出あなたがここにhttps://github.com/Microsoft/TypeScript/blob/master/src/lib/dom.generated.d.ts#L3661ジェネリックEventTargetタイプのみいくつかのメソッドを持って見ることができるように、DOMイベントのtargetはタイプEventTargetです。

あなたのケースでは、どのような種類の要素がターゲットにあるのか正確に分かります。 だからあなたtargetがvalue性質を持っているコンパイラに伝えるために、あなたは（たとえばhttps://github.com/Microsoft/TypeScript/blob/master/src/lib/dom.generated.d.ts#L5248ため `HTMLInputElementの）より具体的な形にそれをキャストする必要が

私はあなたがシングルショットでそれを行うことができるとは思いません（または少なくとも私はそれを行う手法を知らないので）別のmapが必要になります。

const latitudeMinValue$ = latitudeMinimum$ 
    .map(event => event.target) 
    .map((element: HTMLInputElemnet) => element.name) 

const latitudeMaxValue$ = latitudeMaximum$ 
    .map(event => event.target) 
    .map((element: HTMLInputElemnet) => element.name) 

const latituteRange$ = xs.combine(latitudeMinValue$, latitudeMaxValue$) 
    .map(/*([minValue, maxValue])*/); 

アンこれを行うにしてもきれいな方法（私たちは二度map().map()を繰り返しているので、我々は非常に乾燥していないとして）私たちはxstreamによって与えられたcompose演算子を使用することができます。

function eventToTargetValue(event$ Stream<Event>) { 
    return event$.map(event => event.target) 
    .map((element: HTMLInputElement) => element.value) 
} 

const latitudeMinValue$ = latitudeMinimum$ 
    .compose(eventToTargetValue) 

const latitudeMaxValue$ = latitudeMaximum$ 
    .compose(eventToTargetValue) 

const latituteRange$ = xs.combine(latitudeMinValue$, latitudeMaxValue$) 
    .map(/*([minValue, maxValue])*/); 

はそれが役に立てば幸い:)