向模型的弹出窗口添加属性
成功创建 Ionic 弹出窗口后，可以添加针对本项目的 3D-Guided Service Instructions 101 部分在 Creo Illustrate 中创建的属性元数据。此操作通过 PTC Metadata API 来实现，该 API 现已包含在 Vuforia Studio 8.5.13 及更高版本中。
 |
如果您希望了解当前的进展，可以在 GitHub 上的 Appendix 5 中找到本部分的完整代码进行比较。
|
1. 使用 PTC Metadata API 从模型的 JSON 数据中调用相关属性。此版本 API 使用 .then 方法，即在存在模型元数据的情况下使用回调函数来检索数据。
1. 导航至 Home.js 并在 userpick 函数下面直接添加以下代码：
//
//Look at model and see if it has metadata. If it does, then execute the below code and create an object called metadata
PTC.Metadata.fromId(targetName)
.then ( (metadata) => {
 |
如果不在步骤 c 中添加结束括号，则会出现一条错误消息。
|
2. 选中第 12-41 行并单击“缩进”按钮将其缩进。这些行将会放到上述 PTC API 中，因为它们依赖于 promise 成功执行。
3. 将以下代码添加到第 43 行，为 PTC API 函数添加结束括号。这样可以确保不会留下错误或未完成的行。
}) //end brackets for PTC API and .then
//
//catch statement if the promise of having a part with metadata is not met
.catch( (err) => { console.log('metadata extraction failed with reason : ' +err) })
2. 要从元数据属性中发现数据，需要为 PTC Metadata API 使用 get 函数。调用 metadata.get 会检索模型的所有元数据，在此例中，元数据由在 Creo Illustrate 中添加的零件属性构成。使用 pathID 变量（其中包含该零件的具体值数据）可使 metadata.get 函数索引选定零件的数据。有关元数据 API 函数的完整列表，请参阅将 CAD 元数据合并到体验中。此函数用于获取以下变量的值：
◦ 零件的显示名称
◦ 操作说明名称
◦ 零件号
在 $scope.currentSelection 变量下面添加以下代码：
//
// create variables based on attribute names from Creo Illustrate for this model. use metadata.get to obtain the data from the JSON properties for this occurrence.
var partName = metadata.get(pathId, 'Display Name');
var instructionName = metadata.get(pathId, 'illustration');
var partNumber = metadata.get(pathId, 'partNumber');
3. 更改弹出窗口 template 特性的定义。现在，属性数据已导入到 Vuforia Studio，在用户单击零件时，Ionic 弹出窗口应会显示 partNumber 和 partName 变量值。备注部分也已经过编辑以包含更多信息：
//
// adds an ionic popup when a part is clicked. Show the part number and name of the selected object. </br> adds a line break between the two variables
var popup = $ionicPopup.show({
template: '<div>' + partNumber + ' </br>' + partName + '</div>',
scope: $scope
}); //end of ionic popup
4. 单击“保存”并打开“预览”，验证新信息已添加到弹出窗口中。如果显示的图像类似下图所示，则说明此步骤已正确完成。
5. 在下一节中，您将创建并绑定“播放”和“重置”按钮。