メンチカツ

ロースカツが好きです

AngularJS: tabsetで[$compile:nonassign]エラーが出ちゃったよメモ

active要素に評価式を入れていたらこのエラー。

<tabset justified="true" ng-init="activeTab='first'">
    <tab heading="ひとつめ" active="activeTab=='first'"></tab>
    <tab heading="ふたつめ" active="activeTab=='second'"></tab>
    <tab heading="みっつめ" active="activeTab=='third'"></tab>
</tabset>

active要素はラジオボタンのng−model的な変数を設定すれば良いらしい。

<tabset justified="true" ng-init="activeTab['first']=true">
    <tab heading="ひとつめ" active="activeTab['first']"></tab>
    <tab heading="ふたつめ" active="activeTab['second']"></tab>
    <tab heading="みっつめ" active="activeTab['third']"></tab>
</tabset>

上の例だと、activeTab['first']がtrueのとき
activeTab['second']、activeTab['third']はfalseになる。

AngularJS: ng-repeatで[ngRepeat:dupes]が出ちゃったよメモ

オブジェクトのキーが重複していてリピートできないぜってことらしい

これは、ng-repeatの

<div ng-repeat="item in objects">
  {{item.value}}
</div>

の部分を

<div ng-repeat="item in objects track by $index">
  {{item.value}}
</div>

とすると解決する。かもしれない。

stackoverflow.com

AngularJS: UI Routerを採用したらtemplateUrlが表示されなくなった

ロードはしているけど表示がない。
そんなときは、もしかしたらview読むとこが

<div>
  <ng-view></ng-view>
</div>

こうなっているので、

<div>
  <div ui-view></div>
</div>

このように変えてみてください。

AngularJS: Enterキーイベントをトリガーにするメモ

テキスト入れてEnterしたら検索実行とか、キーイベントをトリガーにして
なんかしたいときはこれを書くだけでいけます。

ng-keyup="$event.keyCode == 13 ? doSomething() : null"

htmlだけで完了です。

<div>
    <input type="text" placeholder="キーワード" ng-model="keyword" ng-keyup="$event.keyCode == 13 ? doSomething() : null" />
    <button  ng-click="doSomething()">検索する</button>
</div>

どうでも良い話ですが、 サンプルなどで doSomething() って書くとき、脳裏のはるか彼方から
つがいのチーターがスケボーに乗ってやってきます。

AngularJS: コンパイル前のテキストを描画しないメモ

AngularJSでwebページをロードするとき、

f:id:easy-breezy:20150727111157p:plain

と記述したまんまの状態がチラッと描画されてしまうことがあります。

これは、表示されたくないタグに

ng-cloak

を追記することで解決します。

<div class="result" ng-cloak>
キーワード: {{keyword}} の検索結果({{total || '0'}}件)
</div>

こんな感じで。

Mac OS X で Docker(+nginx)を試す

Dockerでnginxに「Welcome to nginx!」と言われたい
# docker と boot2docker をインストールしよう
brew install docker boot2docker

# boot2docker を準備しよう
boot2docker init
#=>Success: downloaded https://github.com/boot2docker/boot2docker/releases/download/v1.5.0/boot2docker.iso

# boot2docker を起動しよう
boot2docker up
#=>Waiting for VM and Docker daemon to start... 

...

To connect the Docker client to the Docker daemon, please set:
    export DOCKER_CERT_PATH=/Users/you/.boot2docker/certs/boot2docker-vm
    export DOCKER_TLS_VERIFY=1
    export DOCKER_HOST=tcp://192.168.XXX.XXX:2376

boot2docker up 後、環境変数をセットするように言われるので
内容を .bash_profile に追記します。

vi ~/.bash_profile

# 言われたとおりに以下を追記
export DOCKER_CERT_PATH=/Users/you/.boot2docker/certs/boot2docker-vm
export DOCKER_TLS_VERIFY=1
export DOCKER_HOST=tcp://192.168.XXX.XXX:2376

以下のコマンドで、追加した内容を有効化します。

source ~/.bash_profile

Docker のイメージは

# 最新の CentOS
docker pull centos:latest

#最新の MySQL
docker pull mysql:latest

コマンドだけで簡単に入手できます。
イメージはほかにもいろいろ、以下のサイトなどで公開されています。


Docker Hub Registry - Repositories of Docker Images

今回は最新の nginx のイメージを使うので、

#最新の nginx
docker pull nginx:latest

を実施してみます。

ちなみに、 docker pull したときに、

FATA[0000] Post http:///var/run/docker.sock/v1.16/images/create?fromImage=centos%3Alatest: dial unix /var/run/docker.sock: no such file or directory

このエラーが出た場合は source ~/.bash_profile していないか、
環境変数がうまく設定できていないかもしれません。

さて、無事 docker pull できたら、以下を実行してみます。

# nginxのポート80のサービスをポート8080で受けるようにして起動しよう
docker run -it -p 8080:80 nginx:latest /bin/bash
# nginx を開始しよう
service nginx start

ここで、ブラウザから以下にアクセスしてみます。
DOCKER_HOST の部分は、さきほど環境変数で設定したIPアドレスの値です。

http://[DOCKER_HOST]:8080

f:id:easy-breezy:20150309162739p:plain

「Welcome to nginx!」できました!

あとしまつ

起動しているイメージは以下のコマンドで確認できます。

docker ps -a
#=>CONTAINER ID        IMAGE               COMMAND             CREATED             STATUS              PORTS                           NAMES
#=>602fe5bb2372        nginx:latest        "/bin/bash"         2 minutes ago       Up 2 minutes        443/tcp, 0.0.0.0:8080->80/tcp   romantic_lumiere

コンテナIDを指定してdockerを停止します。

# ぜんぶおしまいにしよう
docker stop [CONTAINER ID] #上記例の場合 => docker stop 602fe5bb2372
docker rm [CONTAINER ID] #上記例の場合 => docker rm 602fe5bb2372
boot2docker down

docker runの時にイメージに一意の名前をつけておくと、CONTAINER IDの
代わりに名前を引数にして上記と同じことができます。

すべてを終了させたあと、 docker ps -a してみると、コンテナが消えた
ことを確認できます。

docker ps -a
#=>CONTAINER ID        IMAGE               COMMAND             CREATED             STATUS              PORTS                           NAMES

おつかれさまでした!