2
제가 건물에있는 작은 응용 프로그램이 예 here과 매우 비슷합니다. 내가 Dart SDK version 0.5.9.0_r22879Dart에서 watchers.dispatch()를 호출해야하는 시점은 언제입니까?
의 주요 차이점을 사용하고
는 내가 AJAX 요청을 통해 결과를 업데이트하고, 내 입력 제어를 눌렀을 때 입력 I는이 요청을 할 것입니다.
두 번째 예제 here에서 설명한대로 내 코드에서 명시 적으로 watchers.dispatch()을 호출하지 않으면 결과 목록이 렌더링되지 않습니다.
왜? watchers.dispatch()을 명시 적으로 호출해야하는시기와 템플릿 예제 에서처럼 자동으로 발생해야하는시기는 명확하지 않습니다.
내 HTML : myapp.dart의
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>My App</title>
<link rel="stylesheet" href="myapp.css">
</head>
<body>
<h1>My App</h1>
<div id="seach-box-container">
<input type="text" name="search-box" id="search-box" placeholder="Search" bind-value="searchText" />
</div>
<div id="results-container">
<template instantiate="if noMatches"><span>No matches</span></template>
<template instantiate="if !noMatches"><span>{{results.length}} entries:</span></template>
<div id="app-entries">
<ul>
<template iterate='entry in results'>
<li><pre>{{entry.message}}</pre></li>
</template>
</ul>
</div>
</div>
<script type="application/dart" src="myapp.dart"></script>
<script src="packages/browser/dart.js"></script>
</body>
</html>
중요한 부분 :
당신이 트리거되지 않는 방식으로 모델을 변경해야 할 때마다 명시 적으로watchers.dispatch()를 호출 할 필요가
import 'dart:html';
import 'dart:json' as JSON;
import 'dart:uri' as uri;
import 'package:web_ui/web_ui.dart';
import 'package:web_ui/watcher.dart' as watchers;
String searchText = '';
List<LogEntry> results = [];
bool get noMatches => results.isEmpty;
void main() {
query("#search-box").onKeyPress.listen((e) => handleKeyPress(e));
}
void handleKeyPress(KeyboardEvent e) {
if (!e.ctrlKey && e.keyCode == KeyCode.ENTER) {
doSearch();
}
}
void doSearch() {
if (searchText != '') {
makeRequest();
}
}
void makeRequest() {
HttpRequest.getString('http://url.to/rest-api?q=$searchText')
.then(processString)
.catchError(handleError)
;
}
processString(String jsonString) {
List<Map> logs = JSON.parse(jsonString);
results.clear();
results.addAll(logs.map((l) => new AppEntry.fromJson(l)));
watchers.dispatch();
}
handleError(Error error) {
print('Request failed');
print(error);
}
class AppEntry {
final String message;
AppEntry.fromJson(Map json) : message = json['message'];
}