抓取对象ID并将其插入会话存储Angular

Question

我有一个控制器，该控制器根据第一个下拉框的填充来填充第二个下拉框，尽管WebStorm将其视为语法错误，但此方法运行良好。 我知道想要将fname格式的ID发布到我的会话存储中以在其他地方使用，但是我尝试了下面的代码，我看到Value为

[对象对象]

如果我用

sessionStorage.setItem('format', $scope.formats);

和

未定义

如果我用

sessionStorage.setItem（'format'，$ scope.formats.id）;

我也尝试过

sessionStorage.setItem('format', $scope.formats.formatType.id);

我什么也没有得到，即使是空值

如何正确将ID添加到会话存储中的格式值中？

完整代码

FirstModule.controller('dropDown', function ($scope) {

$scope.productsandformats = [
    {
        "name": "staff",
        "format": [
            {"Fname": "bill", "id": "1"},
            {"Fname": "bob", "id": "2"},
            {"Fname": "tom", "id": "3"}
        ]
    },
    {
        "name": "managers",
        "format": [
            {"Fname": "dick", "id": "4"},
            {"Fname": "jhon", "id": "5"}
        ]
    },

    {
        "name": "directors",
        "format": [
            {"Fname": "willy", "id": "6"}
        ]
    },


    {
        "name": "temp",
        "format": [
            {"Fname": "jeff", "id": "18"},
            {"Fname": "billy", "id": "19"}
        ]
    }];

$scope.productTypeChange = function () {
    $scope.formats = $scope.productsandformats.find(ps => ps.name == $scope.formData.ProductType.name)

    sessionStorage.setItem('format', $scope.formats.id);

}

}）;

为了进一步说明我如何获取ID，下面的代码使用户可以从名称类型中选择一个fname，例如，如果选择职员，您将获得帐单，鲍勃和汤姆，然后在选择它之后，将打印出选定的名称并fname包括fname id，fname id是我需要发送到会话存储的内容

的HTML

<div class="radio col-sm-6" style="margin-top: 0 !important;">
    <label>
        <input type="radio" ng-model="formData.type" value="Create" >
        <span class="glyphicon glyphicon-unchecked">
        </span>
        Need to make a poster?
    </label>
</div>

<div class="radio col-sm-6">
    <label>
        <input type="radio" ng-model="formData.type" value="Preview">
        <span class="glyphicon glyphicon-eye-open">
        </span>
        Already have a poster?
    </label>
</div>

Answer 1

您不能存储object ，只能存储string 。

要存储一个对象，您需要对其进行“字符串化”。

var jsonItem = JSON.stringify($scope.formats);
sessionStorage.setItem('format', jsonItem);

然后要检索它，您需要解析它

var item = sessionStorage.getItem('format');
item = JSON.parse(item)

从MDN Storage / setItem

storage.setItem(keyName, keyValue);

keyName一个DOMString，其中包含要创建/更新的密钥的名称。

keyValue一个DOMString，包含要提供要创建/更新的键的值。

关于查找ID

当你做

$scope.formats = $scope.productsandformats.find(ps => ps.name == 
 $scope.formData.ProductType.name)

您将获得具有此结构的对象

{
    "name": "staff",
    "format": [
        {"Fname": "bill", "id": "1"},
        {"Fname": "bob", "id": "2"},
        {"Fname": "tom", "id": "3"}
    ]
},

所以我想id包含在item.format[0].id用于第一个项目，以此类推。

format是一个数组，因此，如果您不先选择所需的数组元素（例如format[0] ），就无法直接访问id 。

Answer 2

所以我使用了上面的答案，但是要获得ID我必须使用它

 $scope.myFunc = function() {
        var jsonItem = JSON.parse($scope.formData.formatType.id);
        sessionStorage.setItem('format', jsonItem);
    }

@Bolza的回答很好，但我需要更多，所以请继续进行挖掘和试验