分类存档: 角

对于角指令的故障排除提示 (或, 学会爱连字符)

发表评论

我有几个应用程序，使 $http.get() 电话和我想要成为能够与丑陋的错误详细信息隐藏显示格式化的错误消息, 但访问。  基本上, 这:

image

然后如果用户点击错误, 他们看到更多的信息:

image

简单的东西。  因为同样的潜在错误可以出现在行政屏幕，以及最终用户屏幕, 它清楚地叫自定义角指令。  我  发现了这个 优秀的系列 文章 (http://weblogs.asp.net/dwahlin/creating-custom-angularjs-directives-part-i-the-fundamentals) 由伟大 丹 Wahlin.  听从他的建议, 我很快创建了 <你好世界> 指令，来到我更复杂的错误显示刮板. 我跑进一点麻烦用这个更复杂的指令。  快乐, 偶然的排序, 我已经告诉 WebStorm (我用这些天的编辑器) JS 文件是一个角的文件，它帮助我弄清楚这个问题。  这是指令本身的代码:

angular.module(""CDLApp).指令(""generalCdlErrorHandler, 功能() {

    返回 {
        限制: "E",
        替换: true,

        范围: {
            retrieveLastConfigurationError: "&"
        },

        模板:
          '<div 类 ="警戒警报危险" 角色 ="警报" 吴 init ="doShowExpandedErrorDetails = true" 吴秀 ="retrieveLastConfigurationError()">' +
          ' 没有输入/输出错误或其他错误.  这通常是因为配置数据文件不能 ' +
          ' 发现或配置文件中包含不准确的信息 (如引用文档库 ' +
          ' 不存在).' +
          '  <br />' +
          '  <div 吴秀 ="doShowExpandedErrorDetails">' +
          '    <href ="#" 吴单击 ="doShowExpandedErrorDetails = ! "doShowExpandedErrorDetails>' +
          单击此处以隐藏详细信息。 +
          '    </一>: ' +
          '    <br />' +
          '    <上一页>{{retrieveLastConfigurationError() | json}}</上一页>' +
          '    <br />' +
          '  </div>' +
          '  <div 吴秀 ="!"doShowExpandedErrorDetails>' +
          '    <href ="#" 吴单击 ="doShowExpandedErrorDetails = ! "doShowExpandedErrorDetails>' +
          单击这里可以展开错误详细信息。 +
          '    </一>' +
          '  </div>' +
          '</div>'
    };
});

基本上, 我创建了一个新的元素被称为"generalCdlErrorHandler"。  它需要调用 retrieveLastConfigurationError 函数访问，这处理的范围对象中。  我大概可以用父范围, 但我感觉这懒惰。  如果有人认为我应该这样做, 我很乐意听到关于它的评论.

这是一切都好, 但我没有得到任何东西。  没有错误弹出在控制台中 (至少一次，我修好了我创建了沿途的所有 sx 错误).  我只是没得到任何输出指令。  又添加了一些静态文本吴秀指令然后 * 做 * 明白. 这让我觉得或许该指令不允许隐式地创建新的 var，像"doShowExpandedErrorDetails"或有"吴 init"在那里。 

我走进 html 代码，看看是否我有一种类型，这一次 WebStorm 为我排忧解难。  像这样的 retrieveLastConfigurationError 函数中过:

<一般 cdl 错误处理程序 retrieveLastConfigurationError="CDLController.retrieveLastConfigurationError()">
</一般 cdl 错误处理程序>

但它真的需要拥有这一切:

<一般 cdl 错误处理程序检索最后一个配置错误 ="CDLController.retrieveLastConfigurationError()">
</一般 cdl 错误处理程序>

WebStorm 很聪明，知道它将要断字。  如果它没有提供暗示, 我将可能会仍然来进行故障排除 微笑.  有趣的时代!

诀窍就是这: 不仅是指导元素名称用连字符连接, 因此，是你向它添加任何属性。  我有一次添加连字符, 这一切工作得非常棒。  丹的教程碰巧使用单一的短名称, 没有使连接.

希望这有助于人.

</结束>

undefined订阅我的博客.

跟我在 Twitter 上 http://www.twitter.com/pagalvin

HTTP 406 使用角 $http.get 针对 SharePoint 休息结束点时的错误

2 回复

更新: 马克 AD ndersson 指出信息这个伟大的作品: http://blogs.office.com/2014/08/13/json-light-support-rest-sharepoint-api-released/. 这也解释了很多 :).

这可能是最糟糕的一篇博客文章标题过! 安美居.

我通常做所有我针对 O365 实例的原型. 我有我个人的实例，所以，我不需要担心影响别人. 顺便说一句 — — 记得当我们称之为进行虚拟机周围长满了苔藓 — — 我们笔记本电脑上 SQL Server, IIS, 决定 HYPER-V vs. VMWare? 安美居......

已经开发了一个应用程序，在这种环境不使用角, 除其他外, 这:

$http.get(serverUrl)
.成功(功能(数据, 状态, 标题, 配置) {

var getLinksResponse = 数据;

getLinksResponse.value.forEach(功能(结果) {

// 和这么泡沫

这两种不同 SharePoint 在线环境中工作正常. 不过, 当我的同事将其移植到一个 Cloudshare 实例时, 他正 HTTP 406 错误 (其中第一次我收到过那个, 所以...耶, 我想). 我们做了一些研究，发现"接受"标题关闭. SharePoint 在线感到满意:

接受: 应用程序/json

但 cloudshare 实例 (即 SP prem, 在虚拟服务器中承载) 想要经典"odata = 详细"以及在中添加:

接受: 应用程序/json;odata = 详细

要解决这个问题, 我们添加了这样的标题:

var config = {标题: {
接受: 应用程序/json;odata = 详细 '
}
};

$http.get(serverUrl,配置)
.成功(功能(数据, 状态, 标题, 配置) {

var getLinksResponse = 数据;

getLinksResponse.value.forEach(功能(结果) {

// 和这么泡沫

那摆脱 406, 但它也改变了响应的格式. 它是更多......详细. (哈哈!) 需要更多的变化，这里是最后的结果:

var config = {标题: {
接受: 应用程序/json;odata = 详细 '
}
};

$http.get(serverUrl,配置)
.成功(功能(数据, 状态, 标题, 配置) {

var getLinksResponse = 数据;

getLinksResponse.d.results.forEach(功能(结果) {

// 和这么泡沫

这只变成 30 我们的小问题, 所以我们很幸运. 希望有人发现这很有用.

</结束>

操作方法: 启用在同一页的多个角的 SharePoint Web 部件。

5 回复

这个博客帖子描述了你如何可以有多个 Angular.js 基于 SharePoint web 部件 (内容编辑器 web 部件通过引用) 在同一页上. 我打电话内容编辑器 web 部件 (CEWP) 引用 JavaScript 使用 Angular.js 框架"角的 Web 部件"。

角的自举过程是超级容易，只是大约每个示例，您在互联网找到了这样的事情:

<html 吴 app = 'myApp'>

<布拉赫 /><布拉赫 /><布拉赫 />

</html>

这打破了, 然而, 如果您想要启用多个 CEWP 代表在同一页的多个角的 web 部件。. 角将只能自动引导反对第一的吴 app 指令它发现 – 至少版本为角 1.3.6. 解决方案非常简单 — — 那就是手动引导代码相反. 上述现在更改为这样的事情:

<正文>
<d四、 id =”bootstrapHere” 吴控制器 =”作为 theController myController”>
<布拉赫 /><布拉赫 /><布拉赫 />
</div>
</正文>

<脚本 src =”//ajax.googleapis.com/ajax/libs/angularjs/1.3.6/angular.js”></脚本>

<脚本>
angular.bootstrap(angular.element(document.getElementById(“bootstrapHere”)),['' myApp]);
</脚本>

基本上, 而不是使用吴 app 在元素上，要做你的引导, 你拍到该元素的 ID. 然后, 使用引导() 上角的方法本身来控制自举过程在运行时. 这已经进行同一页上的三个不同的角 web 部件和它的作品的魅力.

</结束>

undefined订阅我的博客.

跟我在 Twitter 上 http://www.twitter.com/pagalvin