将 AngularJS 延迟承诺转换为 JSOM 的 Angular 可观察对象
Converting AngularJS deffered promise to AngularX observable for JSOM
我正在将 AngularJS 应用程序转换为 Angular 4,它从 SharePoint 获取一些数据。它使用 JSOM 并为此使用 executeQueryAsync() 方法。
我想使用 executeQueryAsync() 从服务器获取数据并将其存储在我的服务中的可观察对象中。我必须从旧版本(不是我的)转换的代码如下。现在,当我将其转换为我的服务时,我会在语法上苦苦挣扎。我完全没有计划如何将其转换为 Angular 4.
getAllStatusReps($scope) {
const deferred = $q.defer();
const ctx = SP.ClientContext.get_current();
const web = ctx.get_web();
const statusList = web.get_lists().getByTitle(this.statusListName);
const twitterList = web.get_lists().getByTitle(this.twitterListName);
const statReps = statusList.getItems(this.getQueryForAllStatusReps());
const twitReps = twitterList.getItems(this.getQueryForAllStatusReps());
const queryText = `
<View>
<RowLimit>1</RowLimit>
<ViewFields>{0}</ViewFields>
<Query>
<Where><IsNotNull><FieldRef Name=\'EPMStatusDate\' /></IsNotNull></Where>
<OrderBy><FieldRef Name=\'ID\' Ascending= \'False\' /></OrderBy>
</Query>
</View>`;
const statCamlQuery = new SP.CamlQuery();
statCamlQuery.set_viewXml(String.format(queryText, this.getViewFields(true, false)));
const lastStatRep = statusList.getItems(statCamlQuery);
const twitCamlQuery = new SP.CamlQuery();
twitCamlQuery.set_viewXml(String.format(queryText, this.getViewFields(false, false)));
const lastTwitRep = twitterList.getItems(twitCamlQuery);
ctx.load(statReps);
ctx.load(twitReps);
ctx.load(lastStatRep);
ctx.load(lastTwitRep);
ctx.executeQueryAsync(
function () {
deferred.resolve({
statReps: statReps,
twitReps: twitReps,
lastStatRep: lastStatRep,
lastTwitRep: lastTwitRep
});
},
function (sender, args) {
deferred.reject('Request failed. ' + args.get_message() + '\n' + args.get_stackTrace());
}
);
return deferred.promise;
}
您可以通过以下方式将 promise 转换为 observable:
const $thingWhichYouCanSubscribeTo = Observable.fromPromise(serviceOrThingThatReturnsPromise())
也可以在底部尝试这个 return 一个承诺:
return Observable.fromPromise(deferred.promise);
那么你可以这样做:
getAllStatusReps($scope).subscribe(()=>{...}, ()=>{...})
您也可以使用 observables 重写它并创建一个服务 returns 一个新的 observable:
getAllStatusReps($scope)
{
return new Observable(observer =>
{
const ctx = SP.ClientContext.get_current();
const web = ctx.get_web();
const statusList = web.get_lists().getByTitle(this.statusListName);
const twitterList = web.get_lists().getByTitle(this.twitterListName);
const statReps = statusList.getItems(this.getQueryForAllStatusReps());
const twitReps = twitterList.getItems(this.getQueryForAllStatusReps());
const queryText = `
<View>
<RowLimit>1</RowLimit>
<ViewFields>{0}</ViewFields>
<Query>
<Where><IsNotNull><FieldRef Name=\'EPMStatusDate\' /></IsNotNull></Where>
<OrderBy><FieldRef Name=\'ID\' Ascending= \'False\' /></OrderBy>
</Query>
</View>`;
const statCamlQuery = new SP.CamlQuery();
statCamlQuery.set_viewXml(String.format(queryText, this.getViewFields(true, false)));
const lastStatRep = statusList.getItems(statCamlQuery);
const twitCamlQuery = new SP.CamlQuery();
twitCamlQuery.set_viewXml(String.format(queryText, this.getViewFields(false, false)));
const lastTwitRep = twitterList.getItems(twitCamlQuery);
ctx.load(statReps);
ctx.load(twitReps);
ctx.load(lastStatRep);
ctx.load(lastTwitRep);
ctx.executeQueryAsync(
function ()
{
observer.next({
statReps: statReps,
twitReps: twitReps,
lastStatRep: lastStatRep,
lastTwitRep: lastTwitRep
});
},
function (sender, args)
{
observer.error('Request failed. ' + args.get_message() + '\n' + args.get_stackTrace());
}
);
});
}
我正在将 AngularJS 应用程序转换为 Angular 4,它从 SharePoint 获取一些数据。它使用 JSOM 并为此使用 executeQueryAsync() 方法。
我想使用 executeQueryAsync() 从服务器获取数据并将其存储在我的服务中的可观察对象中。我必须从旧版本(不是我的)转换的代码如下。现在,当我将其转换为我的服务时,我会在语法上苦苦挣扎。我完全没有计划如何将其转换为 Angular 4.
getAllStatusReps($scope) {
const deferred = $q.defer();
const ctx = SP.ClientContext.get_current();
const web = ctx.get_web();
const statusList = web.get_lists().getByTitle(this.statusListName);
const twitterList = web.get_lists().getByTitle(this.twitterListName);
const statReps = statusList.getItems(this.getQueryForAllStatusReps());
const twitReps = twitterList.getItems(this.getQueryForAllStatusReps());
const queryText = `
<View>
<RowLimit>1</RowLimit>
<ViewFields>{0}</ViewFields>
<Query>
<Where><IsNotNull><FieldRef Name=\'EPMStatusDate\' /></IsNotNull></Where>
<OrderBy><FieldRef Name=\'ID\' Ascending= \'False\' /></OrderBy>
</Query>
</View>`;
const statCamlQuery = new SP.CamlQuery();
statCamlQuery.set_viewXml(String.format(queryText, this.getViewFields(true, false)));
const lastStatRep = statusList.getItems(statCamlQuery);
const twitCamlQuery = new SP.CamlQuery();
twitCamlQuery.set_viewXml(String.format(queryText, this.getViewFields(false, false)));
const lastTwitRep = twitterList.getItems(twitCamlQuery);
ctx.load(statReps);
ctx.load(twitReps);
ctx.load(lastStatRep);
ctx.load(lastTwitRep);
ctx.executeQueryAsync(
function () {
deferred.resolve({
statReps: statReps,
twitReps: twitReps,
lastStatRep: lastStatRep,
lastTwitRep: lastTwitRep
});
},
function (sender, args) {
deferred.reject('Request failed. ' + args.get_message() + '\n' + args.get_stackTrace());
}
);
return deferred.promise;
}
您可以通过以下方式将 promise 转换为 observable:
const $thingWhichYouCanSubscribeTo = Observable.fromPromise(serviceOrThingThatReturnsPromise())
也可以在底部尝试这个 return 一个承诺:
return Observable.fromPromise(deferred.promise);
那么你可以这样做:
getAllStatusReps($scope).subscribe(()=>{...}, ()=>{...})
您也可以使用 observables 重写它并创建一个服务 returns 一个新的 observable:
getAllStatusReps($scope)
{
return new Observable(observer =>
{
const ctx = SP.ClientContext.get_current();
const web = ctx.get_web();
const statusList = web.get_lists().getByTitle(this.statusListName);
const twitterList = web.get_lists().getByTitle(this.twitterListName);
const statReps = statusList.getItems(this.getQueryForAllStatusReps());
const twitReps = twitterList.getItems(this.getQueryForAllStatusReps());
const queryText = `
<View>
<RowLimit>1</RowLimit>
<ViewFields>{0}</ViewFields>
<Query>
<Where><IsNotNull><FieldRef Name=\'EPMStatusDate\' /></IsNotNull></Where>
<OrderBy><FieldRef Name=\'ID\' Ascending= \'False\' /></OrderBy>
</Query>
</View>`;
const statCamlQuery = new SP.CamlQuery();
statCamlQuery.set_viewXml(String.format(queryText, this.getViewFields(true, false)));
const lastStatRep = statusList.getItems(statCamlQuery);
const twitCamlQuery = new SP.CamlQuery();
twitCamlQuery.set_viewXml(String.format(queryText, this.getViewFields(false, false)));
const lastTwitRep = twitterList.getItems(twitCamlQuery);
ctx.load(statReps);
ctx.load(twitReps);
ctx.load(lastStatRep);
ctx.load(lastTwitRep);
ctx.executeQueryAsync(
function ()
{
observer.next({
statReps: statReps,
twitReps: twitReps,
lastStatRep: lastStatRep,
lastTwitRep: lastTwitRep
});
},
function (sender, args)
{
observer.error('Request failed. ' + args.get_message() + '\n' + args.get_stackTrace());
}
);
});
}