Angularは、フォーム入力に基づいてMongoDBからデータを取得します。

私はAngularとMongoを使い慣れています.Mngoデータベースからデータを取り出して、私が作成している1ページのWebサイトにdivを設定したいと考えています。。プルされるデータは、ユーザーがフォームのドロップダウン・オプションで選択するオプションによって異なります。 Angularにはたくさんのオプションがあります。私はそれをより多く経験している人が私に正しい方向を向けることを期待していました。ユーザーがこれらのオプションのいずれかを選択し、「GO」ボタンを押したときに、「広告」のdivは、オプション固有の移入されるようにAngularは、フォーム入力に基づいてMongoDBからデータを取得します。

<body ng-app=""> 
    <div id='ad'> </div><!-- to be populated with data from MongoDB --> 
<select id='climateZone' ng-model="zone" > 
    <option value="z3">3</option> 
    <option value="z4">4</option> 
    <option value="z5">5</option> 
    <option value="z6">6</option> 
    <option value="z7">7</option> 
    <option value="z8">8</option> 
    <option value="z9">9</option> 
    <option value="z10">10</option> 
</select> 
<button id='Go'><h2>Go!</h2></button>

私はそれをしたい：以下は私のコードの関連するビットですデータベースからの情報。

私はそれがすべて明確であることを望みます。どんな助けもありがとう！

出典

2016-07-05 M CC

'ng-click'、' 'ng-change'などの利用可能なイベントディレクティブで角度apiを調べる時間と' $ http' ajax api。また、あなたのために多くのチュートリアルがあります。このような質問は、このサイトではちょっと広すぎます。あなたは基本的な問題をあなた自身で解決しようとしています。そして、私たちは働いていないコードを微調整するのに役立ちます – charlietfl

MongoDBに直接HTTPリクエストを行うことはできません。代わりに、データベースと通信するサーバー側の実装が必要です。バックエンドにNodeを使用している場合は、Mongooseを見てください：http://mongoosejs.com/

MongooseはMongoDBの多くのライブラリの1つで、モデルの定義、クエリの作成、データの投稿などを行います。たとえば、パラメータに基づいてデータを取得したいとします。最初に、データのモデルが必要です。

var Cat = mongoose.model('Cat', { name: String });

次に、DB接続の上で操作を開始できます。

var mongoose = require('mongoose'); 
mongoose.connect('mongodb://localhost/myDB'); 

Cat.find({name: 'Toddy'}, function (err, result) { 
    if (err) return console.error(err); 
    console.log(result); 
});

あなたのようなので、変数にコンボの値を入れてngChangeとngModelディレクティブを使用して、それが変化したときに適切に反応することができ、言った：例では、あなたの「デイズバックパッカーズリゾート」という名前のすべての猫を持参してください怒鳴ります：

<select id='climateZone' ng-model="zone" ng-change="loadData()"> 
    <option value="z3">3</option> 
    <option value="z4">4</option> 
    <option value="z5">5</option> 
    <option value="z6">6</option> 
    <option value="z7">7</option> 
    <option value="z8">8</option> 
    <option value="z9">9</option> 
    <option value="z10">10</option> 
</select>

$ scopeの "zone"と "loadData（）"メンバーの両方です。

出典

2016-07-05 00:47:12

Angularは、フォーム入力に基づいてMongoDBからデータを取得します。

答えて

関連する問題