"AWS Credentialsのテスト"を押して変数をAWS SDKの新しい結果で更新すると、モデル作成テキストボックスの下のリストが更新されます。しかしそれはしません。テキストボックスを使用して新しいモデルを作成しようとすると、モデルリスト(モデル作成テキストボックスの下)も機能しなくなります。これらの問題の原因は何ですか? http://bghtrbb.github.io/AWS-API-Generator/app/index.htmlAngularJSビューが新しい配列で更新されないのはなぜですか?
ソースコードはここにある::http://github.com/bghtrbb/AWS-API-Generator
あなたが使用できるテストの資格情報が必要な場合は
AWS SDKのような... {"TableNames":["Manufactures","Restaurants","Nutrition"]}
デモはここで見ることができ、結果を返します
これらアクセスキーID: AKIAJPEZZAC77Y7TPADA
秘密アクセスキー: AxXXiNkQ9t7i10BHeLNC4y + XnVXryTzWGKYiSG +ここ
がテストAWS資格情報ボタンここvar app = angular.module("app", []);
app.controller("awsCredentialsTester", function($scope, apiGenerator)
{
$scope.AwsCredentials = {
apiKey: '',
apiSecret: ''
};
$scope.testAwsCredentials = function()
{
AWS.config.update({
accessKeyId: $scope.AwsCredentials.apiKey,
secretAccessKey: $scope.AwsCredentials.apiSecret
});
AWS.config.region = 'us-east-1';
var dynamodb = new AWS.DynamoDB();
dynamodb.listTables({}, function(err, data)
{
if (err)
{
console.log(err, err.stack); // an error occurred
swal("Oh No!", err + "<br/>" + err.stack, "error");
AWS.config.update({
accessKeyId: "",
secretAccessKey: ""
});
}
else
{
apiGenerator.apiKey = $scope.AwsCredentials.apiKey;
apiGenerator.apiSecret = $scope.AwsCredentials.apiSecret;
apiGenerator.changeModelList(data.TableNames);
console.log(data); // successful response
swal("Success!", JSON.stringify(data), "success");
}
})
}
});
ためのコントローラである。ここのためのディレクティブですapiGenerator工場
angular.module('app').factory("apiGenerator", function() {
var apiGenerator = {};
apiGenerator.apiKey = "";
apiGenerator.apiSecret = "";
apiGenerator.models = [];
apiGenerator.resources = [];
apiGenerator.addNewModel = function (newModelName) {
apiGenerator.models.push(newModelName);
1+1;
};
apiGenerator.changeModelList = function (newModelList) {
apiGenerator.models = newModelList;
1+1;
};
return apiGenerator;
});
ですモデル一覧
angular.module('app').directive("modelOverview", ['apiGenerator', function(apiGenerator)
{
return {
restrict: 'AE',
scope: true,
link: function (scope, element, attrs) {
scope.modelOverview = {
newModelName: "",
models: []
};
scope.$watch("models", function (models) {
scope.modelOverview.models = apiGenerator.models;
});
scope.addNewModel = function() {
apiGenerator.addNewModel(scope.modelOverview.newModelName);
scope.modelOverview.newModelName = "";
};
element.bind("keypress", function (event) {
if(event.which === 13) {
scope.addNewModel();
}
});
},
templateUrl: 'assets/components/model_overview/model_overview_directive_template.html'
};
}]);
A最後にここにディレクティブテンプレートがあります
<div class="col-md-4">
<form>
<div class="input-group">
<div class="input-group-addon"><span>Create Model:</span></div>
<input class="form-control" type="text" ng-model="modelOverview.newModelName">
<div class="input-group-btn">
<button class="btn btn-info" type="button" ng-click="addNewModel()" >Go!</button>
</div>
</div>
</form>
<ul class="list-group" id="model-list">
<li class="list-group-item" ng-repeat="model in modelOverview.models"><span> {{model}} </span></li>
</ul>
<span>{{modelOverview.models}}</span>
</div>