検索フォームと結果表示領域の作成
#03 検索フォームを作ろう
http://dotinstall.com/lessons/youtube_search_angularjs/21703
をもとに
検索フォームと結果を表示する領域を作成
まずは index.html で
フォームを作成
<form ng-submit="doSearch()" name="myform">
としてフォーム領域を指定
この中に
<input type="text" ng-model="query" required>
として入力欄を作成
required をつけることで必須入力欄となる
<input type="submit" value="search">
で検索ボタン作成
また、入力欄になにも入力されていない場合
送信ボタンが無効になるようにしておく
これは
<input type="submit" value="search" ng-disabled="myform.$invalid">
とすればよい
ng-disabled="myform.$invalid"
これは
required になっている項目に入力されない限り
このフォーム自体が無効になる
続いて結果表示領域を作成
結果はリスト形式で表示する
このときに ul li で出る●はいらないので
スタイル設定で消す
<ul style="list-style:none; padding:0"> </ul>
style=”list-style:none; を指定すると●が消える