Location via proxy:   [ UP ]  
[Report a bug]   [Manage cookies]                
5
5

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 5 years have passed since last update.

AngularJSのHelloWorldテンプレート

Last updated at Posted at 2014-02-09

[2014/03/10追記] あれからいろいろ勉強して、こっちの方が雛形としてはいいです^^;


スクリプトを書いてローカルブラウザで挙動を確認するためのテンプレートです。
下記の index.html(名前はなんでもいいけど) をローカルPCに保存して、お使いのブラウザへドラッグすれば動きます。
(外部サイトのJavaScriptライブラリを直接参照してるので、ネットに繋がってる必要はあります。)

index.html
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 3.2//EN">
<html ng-app>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.2.12/angular.min.js"></script>
<script type="text/javascript">
    //Controller
    function TestCtrl($scope){
        $scope.sample = "こんにちは世界!";
    }
</script>
</head>
<body>

<div ng-controller="TestCtrl">{{sample}}</div>

</body>
</html>

まだあまり触っていませんが、Knockout.jsと比較して、非JavaScriptプログラマや、例えばPHPのSmarty等のテンプレートエンジンに慣れ親しんでいる方は、AngularJSの方がとっつきやすい印象です。

おまけ:初心者の学習の参考になるサイト

http://js.studio-kingdom.com/angularjs/guide
http://tech.aainc.co.jp/archives/6281

5
5
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
5
5

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?