未捕获的DOMException：无法在'Element'上执行'setAttribute'：'1'不是Laravel刀片模板中的有效属性名称

I have a problem in my code, it is functional and but it bugs me with the console error I am getting from chrome.

My blade template code is:

<select name="business_unit_id" class="form-control">
 @foreach (App\Models\BusinessUnit::all() as $data)
  <option value="{{ $data->id }}"
   {{ old('business_unit_id', $cost_centers->business_unit_id ?? null)
    != $data->id ?: 'selected' }}>
    {{ $data->code.' - '.$data->descr }}
  </option>
 @endforeach
</select>

The console error are:

app.js:41637 Uncaught DOMException: Failed to execute 'setAttribute' on 'Element': '1' is not a valid attribute name.
    at baseSetAttr (http://ksakuws1137/js/app.js:43932:8)
    at setAttr (http://ksakuws1137/js/app.js:43907:5)
    at Array.updateAttrs (http://ksakuws1137/js/app.js:43862:7)
    at invokeCreateHooks (http://ksakuws1137/js/app.js:43218:22)
    at createElm (http://ksakuws1137/js/app.js:43105:11)
    at createChildren (http://ksakuws1137/js/app.js:43202:9)
    at createElm (http://ksakuws1137/js/app.js:43103:9)
    at createChildren (http://ksakuws1137/js/app.js:43202:9)
    at createElm (http://ksakuws1137/js/app.js:43103:9)
    at createChildren (http://ksakuws1137/js/app.js:43202:9)

The culprit is below, but that is needed to in order for the program to behave correctly.

{{ old('business_unit_id', $cost_centers->business_unit_id ?? null)
    != $data->id ?: 'selected' }}>

Anyone encounter the same issue and have a resolution? Thanks.

I found the solution by changing the code in blade template from:

{{ old('business_unit_id', $cost_centers->business_unit_id ?? null)
    != $data->id ?: 'selected' }}>

To:

{{ old('business_unit_id', $cost_centers->business_unit_id ?? null)
                                != $data->id ? '' : 'selected' }}

The culprit then is the "?:", maybe not compliant with HTML5?