4
票
要素のid属性を削除したい
属性を削除するには、要素に対しremoveAttribute()メソッドを実行します。
var elm = document.getElementById("newsitem");
elm.removeAttribute("id");

mjy♦
- 1.2万
3
票
$applyを使っても$scopeに反映されない
thenに渡している関数は非同期で呼ばれるので、そのタイミングで$scope.$applyしても無駄です。
$scope.$applyはthen内で呼ぶ必要があります。
setTimeout(function () {
getData().then(function(value) {
$scope.$apply(function() {
$...
3
票
Accepted
AngularJSにて、変数に$scopeを代入した際の質問
JavaScriptにおいて、オブジェクトや配列を変数に代入すると参照渡しとなります。
dataは最終的に$scope.nav.getCurrentPage().options.itemを参照しているということです。
これを回避するには、angular.copy()を使用します。
var data = angular.copy($scope.item);
2
票
navigator.resetToPage()の際にnavigator.getPages()が正しい値を返さない
resetToPageの実装は以下のようになっています。
resetToPage: function(page, options) {
options = options || {};
if (!options.animator && !options.animation) {
options.animation = 'none';
}
...
2
票
ons-navigatorにて同一のページを複数表示した場合の、getElementByIdに代わるエレメント検索手段
そもそもjavascriptでは
getElements系で配列として取得することが出来ます。
後は配列の順番で対象を特定してやれば好きにコントロールできるはずです。
getElementsByName("name")
getElementsByTagName("tagName")
getElementsByClassName("class")
ex)
fast_input_value = ...
2
票
ons-navigatorにて同一のページを複数表示した場合の、getElementByIdに代わるエレメント検索手段
自己回答になりますが、代替案で、以下のような方法を見つけました。
初心者の為、正しく理解できているか心もとないので、上級者の方、フォローお願いします。
idを使わずに、ng-modelを使用することで、データバインディング(?)できる。
<script>
var module = ons.bootstrap();
module.controller('...
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 ...
2
票
Accepted
replacePageで画面遷移する際のアニメーションの方向を変えたい
理解できる範囲で解析しただけなので詳しく説明できませんが、onsenui.jsをカスタマイズしないと左から右は無理のようです。
SimpleSlideTransitionAnimator()、IOSSlideTransitionAnimator()を直接改造するか、新たに左から右用を追加すれば実現できると思います。
// Preset transition animators.
...
1
票
OnsenUIの基本的な構成方法
私も初心者ですので、初心者の視点から・・・。
コードがないのではっきりしたことは言えませんが、JavaScriptが実行されるタイミングが問題かもしれません。ページ切り替えボタンをタッチした瞬間など、各要素が構築される「前」にDOMに対する制御をかけてしまうと、望んだ結果が得られません。
試行錯誤でしたが、私は以下のイベントリスナーをセットすることで対処しました。
document....
1
票
divタグに"background-image"を設定しても画像表示しません。
親要素の高さが 0 なのに height を相対指定しているからではないでしょうか?
以下の例でやっているように絶対指定するか、親要素の高さを確保した上で相対指定するようにしてみてください。
.main-body {
background-image: url('https://graph.facebook.com/802198103190018/picture?type=...
1
票
angularjsのpromise処理を使用時、onsen ui のmodalが表示されない
myModal.hide()は時間がかかる処理の解決後に呼んでください。
// コントローラー
app.controller("MainController", ["$scope", "$q", "jikanKakaruFactory", function($scope, $q, jikanKakaruFactory) {
// モーダル表示
myModal.show();
...
1
票
別CSSファイルのスタイルを読み込み、background-imageでローカル画像を指定の時だけ表示されない
なお、OnsenUI最小限のテンプレートのindex.htmlに記述し、cssフォルダのstyle.cssを読み込んでいます。
style.cssはcssフォルダに存在するわけですから、cssフォルダからimagesフォルダを見るには、一つ前のフォルダに戻る必要があるので、../images/と指定します。
// ├ index.html
// ├ css - style.css
// └ ...
1
票
PullHookサンプルでの初期読込の追加方法
コントローラ内のons.ready()で取得処理を呼び出します。
ons.bootstrap()
.controller('DemoController', function($scope, $timeout, $http) {
$scope.items = [];
ons.ready(function() {
loadJson(...
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}}"とすることで、...
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/...
1
票
スクロールバー表示の仕方について
iScroll5を使ってみてはどうでしょうか。
http://cubiq.org/iscroll-5
_iscroll = new IScroll(_$obj.get(0),
{
scrollbars: true,
fadeScrollbars: true
});
ただ、OnsenUIはiScroll4を内包してたと思うので併用は無理、...
1
票
ons-toolbarのカスタマイズ方法について
Onsen UI v1.3.15のonsenui.jsの20214行目にons-toolbarのコードがあります。
AngularJSで記載されており、また20259行で'left', 'center', 'right'が指定された場合という条件があるため、回答としては「ありません」となります。
ons-toolbarによって出力された内容を解析し、jQueryを使用したいなら、...
1
票
jQueryからOnsenUIの画面遷移を実行出来ますか?
部分的ではなく全体を見ないとどこが問題か判断できませんが、
AngularJSのコントローラー定義
ng-controller="ctrl_search.html"
クラス定義(HTML)
class="cs-ulh"
Onsen UIのナビゲーター定義
<ons-navigator var="myNavigator">
遷移先のhtmlファイル
...
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" ...
1
票
AngularJSでデータ入力して、別のページにTodoリストのようにリスト追加する機能を作りたい
入力されたテキストを配列として保持しておくために、factory内に変数を用意しました。
ShareControllerAでadd()メソッドを定義して、ボタンが押されたタイミングでその配列にテキストを追加するようにしました。
ons-lazy-repeatを使うためにShareControllerCでデリゲートオブジェクトを定義しました。
ナビゲーションはとりあえずons-...
1
票
Onsen UI のラジオボタンで初期設定をしてもチェックマークが表示されない
Onsen UIのクラスradio-buttonは、inputタグのchecked属性が存在するまたは実際にタップされた場合にチェックを表示する動きのようです。
inputタグの{{timeOutList.selected}}は、そのまま{{timeOutList.selected}}と出力されるため、チェックが表示されません。
ディレクティブを使用し、取得したエレメント(inputタグ)...
1
票
Radiobutton Listでラジオボタンをリストの右側に表示する方法
クラスを追加してCSSで右側に移動させます。
<style>
.radio-button--right {
position: absolute;
right: 5px;
}
</style>
:
: 省略
:
<ons-list-item modifier="tappable">
<label ...
1
票
java scriptの動きが反映されません
恐らく components/loader.js の中でAngularJSが読み込まれていますが、これより先に jquery-1.11.0.min.js を読み込んでいるためそのエラーが出ているのだと思います。正常に動作させるには、AngularJSやOnsenUIより後にjQueryを読み込ませるようです(参考)。
ただ、...
1
票
OnsenUI+GoogleMaps ons-page内で表示されない tabbarで表示したい
自己解決しました。
onsenui が生成する背景が地図を隠してしまうことが原因でした。
■対策
jQueryかzeptoで邪魔をしている背景を消してあげます。
ons.readyで消すと地図のロード完了まで画面が真っ黒になってしまうので、MAP_READYで消してあげるといいです。
ということで、動作するコードです。
【onsenui + googlemap 動作するコード】
&...
1
票
Accepted
ons-carousel-itemをng-repeatで作成した場合にinitial-indexが効かない
おそらくons-carousel-itemでng-repeatを使用しているので、ons-carouselでinitial-indexを指定してもその時点ではons-carousel-itemは一つも存在せず、反映されないのではないかと思われます。
コントローラを使用しているのであれば、setActiveCarouselItemIndexメソッドで指定できます。
ons.ready(...
1
票
onsenuiがユニットテストでエラーが発生する
ons.isWebView()をスパイして常にtrueを返すようにするといいです。
describe('OnsenUIのテスト', function() {
beforeEach(function() {
spyOn(ons, 'isWebView').and.returnValue(true);
});
it('テストサンプル', function() {
// ...
1
票
Onsen UI タブからタブへの移動はできるのでしょうか?
<ons-tabbar>にはタブを切り替えるためのメソッドsetActiveTab()が用意されているので、それを利用すると良いでしょう。
下記のスニペットを実行してみてください。
angular.module('app', ['onsen'])
.controller('PageController', function($scope){
$scope....
1
票
スライディングメニューのテンプレートを使っているのですがleft側のForm1.htmlへ画面が飛びません。どうすれば切り替わるようになるでしょうか?
<ons-toolbar-button ng-click="Form1.html">
のng-clickに問題があります。
ng-clickは、クリックされた場合の処理を書かないといけません。
下記の例ではons-navigatorを利用し、pushPageメソッドでForm1.htmlのページを表示させています。
※onclickでも同様に動作します。
<ons-...
1
票
onsenUIのnavigaterとtabberの関連付けについて
<ons-tab>のpage属性に<ons-navigator>から始まるテンプレートを指定し、タブごとにページスタックの管理を行うのが基本的なやり方かと思います。
angular.module('app', ['onsen']);
<link href="https://cdn.rawgit.com/OnsenUI/OnsenUI/1.3.12/...
1
票
iOSの実機でタップが拾えないのはなぜ?
自己解決しました。
ドキュメントを読み返して見たところ、FAQの5.16に解説がありました。ビルド前には手動でCordovaプラグインを指定する必要があるのですね。
http://docs.monaca.mobi/cur/ja/faq/application/
IDEでCordovaプラグインを取捨選択してみたら、必要なプラグインが解りました。
Only top scored, non community-wiki answers of a minimum length are eligible
関連するタグ
onsen-ui × 219monaca × 133
angularjs × 51
javascript × 35
cordova × 16
jquery × 11
html5 × 10
html × 9
css × 7
ios × 6
android × 4
visual-studio × 2
ajax × 2
jquery-mobile × 2
json × 1
iphone × 1
google-chrome × 1
sqlite × 1
ios8 × 1
webview × 1
push-notification × 1
angular × 1
アプリ内課金 × 1
angular2 × 1
scrollview × 1