質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.47%
Angular

Angularは、JavaScriptフレームワークです。AngularJSの後継であり、TypeScriptベースで実装されています。機能ごとに実装を分けやすく、コードの見通しが良いコンポーネント指向です。

継承

継承(インヘリタンス)はオブジェクト指向プログラミングに存在するシステムです。継承はオブジェクトが各自定義する必要をなくし、継承元のオブジェクトで定義されている内容を引き継ぎます。

配列

配列は、各データの要素(値または変数)が連続的に並べられたデータ構造です。各配列は添え字(INDEX)で識別されています。

Q&A

0回答

368閲覧

AngularJS $scopeの値の継承について

investerinveste

総合スコア6

Angular

Angularは、JavaScriptフレームワークです。AngularJSの後継であり、TypeScriptベースで実装されています。機能ごとに実装を分けやすく、コードの見通しが良いコンポーネント指向です。

継承

継承(インヘリタンス)はオブジェクト指向プログラミングに存在するシステムです。継承はオブジェクトが各自定義する必要をなくし、継承元のオブジェクトで定義されている内容を引き継ぎます。

配列

配列は、各データの要素(値または変数)が連続的に並べられたデータ構造です。各配列は添え字(INDEX)で識別されています。

0グッド

0クリップ

投稿2020/05/10 00:14

前提・実現したいこと

AngularJsを使って項目情報を設定する処理を作成している
画面から項目の情報を入力して保存、項目追加できる処理を実装したい。

AngularJsを使って画面からの入力値を保存、追加できる処理を実装しようとして
以下のような実装を行うと既に追加(保存)した値も同時に更新される現象が発生します。
■処理イメージ
①画面で項目情報を設定 $scope.paramというオブジェクトにプロパティを追加していく想定
②追加ボタンを押下して①で入力した結果を$scope.itemsという配列にpushして①の内容を保存
③項目追加がある場合、再度$scope.paramを編集
④追加ボタンを押下して③で入力した結果を$scope.itemsという配列にpushして③の内容を保存

このような実装をすると③の処理を実行すると、②でpushした配列の値まで変更されてしまいます。

実際のソースコード

---test.html

<p>項目名:<input type='text' ng-model='param.idvalue' placeholder='項目名'></p> <select ng-model="param.template" ng-options="template.template as template.name for template in templatetypes"></select> <button type="submit" ng-click="addItem(param)">新規項目追加</button>

---controller.js
//入力パラメータの定義
$scope.param={
template:'a',
};
//新規項目追加ボタン押下
$scope.addItem = function(param){
$scope.view.items.push(param);
}

試したこと

値をそのまま渡すことが問題かと思い、以下のように別のオブジェクトに移して追加なども
してみましたが、結果が変わらずでした。
//新規項目追加ボタン押下
$scope.addItem = function(param){
var temp=param;
$scope.view.items.push(temp);
}

色々と調べてみて配列やオブジェクトなど型によって継承方法が異なるということは分かったのですが
具体的な対処方法がわからずという状態です。
何か良い解決方法はないでしょうか?

補足情報

以下のリソースを使用
"angular": "^1.7.9",
"angular-resource": "^1.7.9",
"angular-route": "^1.7.9",
"angular-sanitize": "^1.7.9",

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

まだ回答がついていません

会員登録して回答してみよう

アカウントをお持ちの方は

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.47%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問