AngularJS

【AngularJS】AngularJSとは

AngularJSについて雑記。 以下リンク内容を写経でお勉強 Angularjsとは 参考 www.tohoho-web.com/ex/angularjs.html http://dev.classmethod.jp/client-side/javascript/angularjs-2/◼︎Googleとコミュニティが開発するjsフレームワーク ◼︎MVC ◼︎クライアント…

【AngularJS】【JavaScript】タブ切り替え

とりあえずソースメモ。 列の要素にname, create_time, 有効無効のタブがある感じで、有効無効を切り替えるところの処理。 雑にメモ。◼︎invalid.html <tr ng-repeat="user in users" ng-show="sort === -1 || user.is_use === sort"> <td>{{$index}}</td> <td ng-bind="user.username"></td> <td ng-bind="user.create_time"></td> <td> <div class="valid-tab"> </div></td></tr>

【AngularJS】リンクを新規タブで開く

$location.path('/path', '_blank'); こうではなく window.open( '/path', '_blank' ); こうでした。 <a href="javascript:;" target="_blank">{{〜〜}}</a> では反映されませんでした。

【AngularJS】エスケープしないで出力させたい時

参考 AngularJS:文字列をエスケープさせずに出力する方法 - Qiita www.buildinsider.net 基本は普通にbindするとエスケープされるみたい。 エスケープさせないにはng-bind-htmlでやるかtrustAsHtmlでするかangular-sanitizeモジュールを使うかぐらいかな。tr…

【AngularJS】フィルタをかけようとorderByしたけど効かなかった

Resource {0: Object, 1: Object} 0: Object content: "こっちが古いよ" id: 1 target_date: "2016-02-09 00:00:00" title: "ひとつめ" 1: Object content: "こっちが新しいよ" id: 2 target_date: "2016-02-11 00:00:00" title: "ふたつめ"みたいなコールバ…

【AngularJS】factory使ってapiたたく

http://localhost:6960/api/v1/notices/index?access-token=[アクセストークン]&lang=jp みたいなURLの作り方 'use strict'; angular.module('spmartClientApp') .factory('Infomation', function ($resource, $http, $rootScope, DataService, $cookies) { …

【AngularJS】 ng-modelとng-initとrouteProvider

◼︎ng-init

【AngularJS】DIとか配列アノテーションとか依存性注入とか$injectプロパティとか

参考 AngularJSの依存性注入を利用するには? - Build Insider .controller('MainCtrl', ['$scope', 'JsonData', function ($scope, JsonData) { … .controller('MainCtrl', function ($scope,$cookies,$location,$rootScope,$sce) { ... とコントロール名の…

【AngularJS】ToDo List

今回も参考はドットインストール様 #01 ToDoを表示させよう | AngularJSで作るToDoアプリ - プログラミングならドットインストール まずは、 checkboxつけて終わったタスクにはチェックつけてグレーの線を引く//index.html <h1>Todo List</h1> <div ng-controller="mainCtrl"> <ul> <li ng-repeat="task in tasks"> <input type="checkbox" ng-model="task.done"> <span class="done-{{task.done}}">{{task.…</span></li></ul></div>

【AngularJS】ng-bind

参考 ngBind | AngularJS 1.2 日本語リファレンス | js STUDIO 例えば入力フォームで入力されたテキストを 動的に表示する場合 <input type="text" ng-model="name"> <p>こんにちは{{name}}</p> が一般的。そんで、ng-bindは何かと言うと ngBind属性は、Angularに指定したHTML要素のテキスト内容を与え…

【AngularJS】 入門

全部ドットインストールの内容。 AngularJS入門 (全12回) - プログラミングならドットインストール AngularJSの特徴 <html lang="ja" ng-app> と書く。ngはAngularのng。そして、例えば <input type = "text" ng-model="name"> <p>こんにちは{{name}}<p> と書くと、動的にこんにちはのあとにnameが表示される。 つまり、HTMLの要</p></p></html>…