次のタグが付いている話題の回答:

4

要素のid属性を削除したい

属性を削除するには、要素に対しremoveAttribute()メソッドを実行します。 var elm = document.getElementById("newsitem"); elm.removeAttribute("id");
mjy's user avatar
  • 1.2万
3

$applyを使っても$scopeに反映されない

thenに渡している関数は非同期で呼ばれるので、そのタイミングで$scope.$applyしても無駄です。 $scope.$applyはthen内で呼ぶ必要があります。 setTimeout(function () { getData().then(function(value) { $scope.$apply(function() { $...
hiro's user avatar
  • 1,074
3
Accepted

AngularJSにて、変数に$scopeを代入した際の質問

JavaScriptにおいて、オブジェクトや配列を変数に代入すると参照渡しとなります。 dataは最終的に$scope.nav.getCurrentPage().options.itemを参照しているということです。 これを回避するには、angular.copy()を使用します。 var data = angular.copy($scope.item);
otak-lab's user avatar
  • 1,438
2

navigator.resetToPage()の際にnavigator.getPages()が正しい値を返さない

resetToPageの実装は以下のようになっています。 resetToPage: function(page, options) { options = options || {}; if (!options.animator && !options.animation) { options.animation = 'none'; } ...
cither's user avatar
  • 1,448
2

ons-navigatorにて同一のページを複数表示した場合の、getElementByIdに代わるエレメント検索手段

そもそもjavascriptでは getElements系で配列として取得することが出来ます。 後は配列の順番で対象を特定してやれば好きにコントロールできるはずです。 getElementsByName("name") getElementsByTagName("tagName") getElementsByClassName("class") ex) fast_input_value = ...
通りすがりのIT技術者's user avatar
2

ons-navigatorにて同一のページを複数表示した場合の、getElementByIdに代わるエレメント検索手段

自己回答になりますが、代替案で、以下のような方法を見つけました。 初心者の為、正しく理解できているか心もとないので、上級者の方、フォローお願いします。 idを使わずに、ng-modelを使用することで、データバインディング(?)できる。 <script> var module = ons.bootstrap(); module.controller('...
Atsuhiro Kitagawa's user avatar
2
Accepted

ons-popover 内で ons-scrollerが使えない

自己解決できましたので、要点をまとめておきます。 問題点(調査中に発見した問題点を含む) ・Ons-Popover内のOns-Scrollerが機能しない。 ・コンソール画面に「Onsen UI require jqLite. Load jQuery after loading AngularJS to fix this error. jQuery may break Onsen UI ...
eclipse's user avatar
  • 85
2
Accepted

replacePageで画面遷移する際のアニメーションの方向を変えたい

理解できる範囲で解析しただけなので詳しく説明できませんが、onsenui.jsをカスタマイズしないと左から右は無理のようです。 SimpleSlideTransitionAnimator()、IOSSlideTransitionAnimator()を直接改造するか、新たに左から右用を追加すれば実現できると思います。 // Preset transition animators. ...
otak-lab's user avatar
  • 1,438
1

OnsenUIの基本的な構成方法

私も初心者ですので、初心者の視点から・・・。 コードがないのではっきりしたことは言えませんが、JavaScriptが実行されるタイミングが問題かもしれません。ページ切り替えボタンをタッチした瞬間など、各要素が構築される「前」にDOMに対する制御をかけてしまうと、望んだ結果が得られません。 試行錯誤でしたが、私は以下のイベントリスナーをセットすることで対処しました。 document....
eclipse's user avatar
  • 85
1

divタグに"background-image"を設定しても画像表示しません。

親要素の高さが 0 なのに height を相対指定しているからではないでしょうか? 以下の例でやっているように絶対指定するか、親要素の高さを確保した上で相対指定するようにしてみてください。 .main-body { background-image: url('https://graph.facebook.com/802198103190018/picture?type=...
KoRoN's user avatar
  • 5,132
1

angularjsのpromise処理を使用時、onsen ui のmodalが表示されない

myModal.hide()は時間がかかる処理の解決後に呼んでください。 // コントローラー app.controller("MainController", ["$scope", "$q", "jikanKakaruFactory", function($scope, $q, jikanKakaruFactory) { // モーダル表示 myModal.show(); ...
cither's user avatar
  • 1,448
1

別CSSファイルのスタイルを読み込み、background-imageでローカル画像を指定の時だけ表示されない

なお、OnsenUI最小限のテンプレートのindex.htmlに記述し、cssフォルダのstyle.cssを読み込んでいます。 style.cssはcssフォルダに存在するわけですから、cssフォルダからimagesフォルダを見るには、一つ前のフォルダに戻る必要があるので、../images/と指定します。 // ├ index.html // ├ css - style.css // └ ...
otak-lab's user avatar
  • 1,438
1

PullHookサンプルでの初期読込の追加方法

コントローラ内のons.ready()で取得処理を呼び出します。 ons.bootstrap() .controller('DemoController', function($scope, $timeout, $http) { $scope.items = []; ons.ready(function() { loadJson(...
otak-lab's user avatar
  • 1,438
1
Accepted

左スワイプ(ons-carousel)で削除ボタンを表示→クリックで該当アイテムを削除→次のアイテムが左スワイプされて表示される

How to refresh a list with an ons-carousel when ons-lazy-repeat detects a changeに似たような質問があります。 ng-repeatで繰り返した場合、myCarouselは最後のons-carouselに対して付けられるため、うまく動作しないようです。 var="carousel.{{$index}}"とすることで、...
otak-lab's user avatar
  • 1,438
1
Accepted

pushPage先にあるons-switchを、動的に操作したい

PageがPushされる時に"prepush"というイベントが発生します。 http://ja.onsen.io/guide/overview.html#EventHandling ons-switchにvar属性を付けてJavaScriptから使えるようにして、 setCheckedメソッドでDBから読み込んだ値を設定するとよいかと。 http://ja.onsen.io/reference/...
user13314's user avatar
  • 351
1

スクロールバー表示の仕方について

iScroll5を使ってみてはどうでしょうか。 http://cubiq.org/iscroll-5 _iscroll = new IScroll(_$obj.get(0), { scrollbars: true, fadeScrollbars: true }); ただ、OnsenUIはiScroll4を内包してたと思うので併用は無理、...
nandai's user avatar
  • 36
1

ons-toolbarのカスタマイズ方法について

Onsen UI v1.3.15のonsenui.jsの20214行目にons-toolbarのコードがあります。 AngularJSで記載されており、また20259行で'left', 'center', 'right'が指定された場合という条件があるため、回答としては「ありません」となります。 ons-toolbarによって出力された内容を解析し、jQueryを使用したいなら、...
otak-lab's user avatar
  • 1,438
1

jQueryからOnsenUIの画面遷移を実行出来ますか?

部分的ではなく全体を見ないとどこが問題か判断できませんが、 AngularJSのコントローラー定義 ng-controller="ctrl_search.html" クラス定義(HTML) class="cs-ulh" Onsen UIのナビゲーター定義 <ons-navigator var="myNavigator"> 遷移先のhtmlファイル ...
user13314's user avatar
  • 351
1

Onsen UI におけるラジオボタンの仕様について

あまりイケてないですが、widthを指定して調整してみるとか。 <li class="list__item list__item--tappable" style="width: 200px;"> <label class="radio-button radio-button--list-item"> <input type="radio" ...
user13314's user avatar
  • 351
1

AngularJSでデータ入力して、別のページにTodoリストのようにリスト追加する機能を作りたい

入力されたテキストを配列として保持しておくために、factory内に変数を用意しました。 ShareControllerAでadd()メソッドを定義して、ボタンが押されたタイミングでその配列にテキストを追加するようにしました。 ons-lazy-repeatを使うためにShareControllerCでデリゲートオブジェクトを定義しました。 ナビゲーションはとりあえずons-...
user13314's user avatar
  • 351
1

Onsen UI のラジオボタンで初期設定をしてもチェックマークが表示されない

Onsen UIのクラスradio-buttonは、inputタグのchecked属性が存在するまたは実際にタップされた場合にチェックを表示する動きのようです。 inputタグの{{timeOutList.selected}}は、そのまま{{timeOutList.selected}}と出力されるため、チェックが表示されません。 ディレクティブを使用し、取得したエレメント(inputタグ)...
otak-lab's user avatar
  • 1,438
1

Radiobutton Listでラジオボタンをリストの右側に表示する方法

クラスを追加してCSSで右側に移動させます。 <style> .radio-button--right { position: absolute; right: 5px; } </style> : : 省略 : <ons-list-item modifier="tappable"> <label ...
otak-lab's user avatar
  • 1,438
1

java scriptの動きが反映されません

恐らく components/loader.js の中でAngularJSが読み込まれていますが、これより先に jquery-1.11.0.min.js を読み込んでいるためそのエラーが出ているのだと思います。正常に動作させるには、AngularJSやOnsenUIより後にjQueryを読み込ませるようです(参考)。 ただ、...
unarist's user avatar
  • 1.5万
1

OnsenUI+GoogleMaps ons-page内で表示されない tabbarで表示したい

自己解決しました。 onsenui が生成する背景が地図を隠してしまうことが原因でした。 ■対策 jQueryかzeptoで邪魔をしている背景を消してあげます。 ons.readyで消すと地図のロード完了まで画面が真っ黒になってしまうので、MAP_READYで消してあげるといいです。 ということで、動作するコードです。 【onsenui + googlemap 動作するコード】 &...
Yamashita's user avatar
1
Accepted

ons-carousel-itemをng-repeatで作成した場合にinitial-indexが効かない

おそらくons-carousel-itemでng-repeatを使用しているので、ons-carouselでinitial-indexを指定してもその時点ではons-carousel-itemは一つも存在せず、反映されないのではないかと思われます。 コントローラを使用しているのであれば、setActiveCarouselItemIndexメソッドで指定できます。 ons.ready(...
otak-lab's user avatar
  • 1,438
1

onsenuiがユニットテストでエラーが発生する

ons.isWebView()をスパイして常にtrueを返すようにするといいです。 describe('OnsenUIのテスト', function() { beforeEach(function() { spyOn(ons, 'isWebView').and.returnValue(true); }); it('テストサンプル', function() { // ...
cither's user avatar
  • 1,448
1

Onsen UI タブからタブへの移動はできるのでしょうか?

<ons-tabbar>にはタブを切り替えるためのメソッドsetActiveTab()が用意されているので、それを利用すると良いでしょう。 下記のスニペットを実行してみてください。 angular.module('app', ['onsen']) .controller('PageController', function($scope){ $scope....
cither's user avatar
  • 1,448
1

スライディングメニューのテンプレートを使っているのですがleft側のForm1.htmlへ画面が飛びません。どうすれば切り替わるようになるでしょうか?

<ons-toolbar-button ng-click="Form1.html"> のng-clickに問題があります。 ng-clickは、クリックされた場合の処理を書かないといけません。 下記の例ではons-navigatorを利用し、pushPageメソッドでForm1.htmlのページを表示させています。 ※onclickでも同様に動作します。 <ons-...
otak-lab's user avatar
  • 1,438
1

onsenUIのnavigaterとtabberの関連付けについて

<ons-tab>のpage属性に<ons-navigator>から始まるテンプレートを指定し、タブごとにページスタックの管理を行うのが基本的なやり方かと思います。 angular.module('app', ['onsen']); <link href="https://cdn.rawgit.com/OnsenUI/OnsenUI/1.3.12/...
cither's user avatar
  • 1,448
1

iOSの実機でタップが拾えないのはなぜ?

自己解決しました。 ドキュメントを読み返して見たところ、FAQの5.16に解説がありました。ビルド前には手動でCordovaプラグインを指定する必要があるのですね。 http://docs.monaca.mobi/cur/ja/faq/application/ IDEでCordovaプラグインを取捨選択してみたら、必要なプラグインが解りました。
PowerYOGA's user avatar

Only top scored, non community-wiki answers of a minimum length are eligible